🌍 Tab 1 — Prehistoric World A living, animated prehistoric scene that changes completely with each geological period. Selecting Triassic, Jurassic, Cretaceous, or K-Pg Event transforms the sky colour, vegetation, volcano activity, and dinosaur species on screen. Theropods (bipedal), sauropods (long-necked), and pterosaurs move and bob across the landscape with walking animation. A time-of-day slider cycles through dawn, daylight, dusk, and night — stars appear at night and the sun arcs across the sky by day. Weather modes (Clear, Cloudy, Rain, Storm) add rain streaks and cloud cover. Volcanic ash particles drift from the background volcano in the Triassic and Jurassic scenes. Global temperature, oxygen level, and CO₂ concentration for each era are shown live in the side panel. Hit ☄️ Impact! to jump straight to the extinction event. 📊 Tab 2 — Timeline An interactive geological timeline spanning the full Mesozoic — 252 Ma to 66 Ma. Drag the time cursor to travel through the Triassic, Jurassic, and Cretaceous, and watch the side panel update with the period name, estimated global temperature, and known species count. Seventeen major events are plotted as vertical markers: mass extinctions sit at full height, species events stagger between short and medium tiers so labels never overlap. Each label sits on a dark pill background for legibility. A temperature curve overlays the timeline axis. Period bands (Triassic / Jurassic / Cretaceous) are colour-coded across the full canvas. 🦖 Tab 3 — Species Explorer Nine key species are displayed in a 3×3 animated grid — T. rex, Brachiosaurus, Triceratops, Stegosaurus, Velociraptor, Spinosaurus, Ankylosaurus, Iguanodon, and Archaeopteryx. Each cell shows the dinosaur's walking or swaying animation, its period badge, body length, and weight. Clicking any cell loads its full profile in the side panel: scientific name, geological age, diet, bite force or other distinguishing stats, and a paragraph on its biology and recent fossil discoveries. A clade filter (Theropods, Sauropods, Ceratopsians, Ankylosaurs, Ornithopods) narrows the grid to the selected group. 💥 Tab 4 — K-Pg Extinction A six-phase simulation of the Chicxulub asteroid impact, 66 million years ago. Before — a peaceful Cretaceous scene with living dinosaurs. Entry — the fireball streaks across the sky at the set velocity. Impact — expanding shockwave rings, ejecta debris fountaining outward, blinding flash. Firestorm — global fires blanketing the surface, smoke columns rising. Winter — ash snowfall, temperature plunge, bare dead trees, total darkness. Recovery — vegetation slowly returns, early mammals appear, recovery percentage climbs with the years-after-impact slider. Asteroid diameter (5–20 km) and velocity (10–40 km/s) are adjustable — energy output, global temperature, species extinction percentage, and recovery time all recalculate in real time. 🧬 Tab 5 — Evolution Tree A radial phylogenetic tree of 19 dinosaur clades, from the root Dinosauria node through the Saurischia / Ornithischia split, down to families like Tyrannosauridae, Dromaeosauridae, Titanosauria, and Avialae (birds). Each node glows in its clade colour and pulses gently. Hover any node to see its name and first-appearance date in millions of years. Bézier curves connect parent and child clades. A red dashed line marks the K-Pg boundary at 66 Ma — only the Avialae branch crosses it, illustrating that birds are the sole surviving dinosaur lineage. A geological time scale runs along the bottom with Triassic, Jurassic, and Cretaceous colour bands.

🦠 Tab 1 — Natural Selection Organisms carry genes for speed, size, and camouflage as they move, forage for food, and evade predators. Each generation, survivors reproduce and mutations accumulate, shifting the population's average traits in real time. Four habitats to choose from — savanna, forest, arctic, and ocean — with adjustable predator count, mutation rate, selection pressure, and food abundance. Right-click any organism to remove it, simulating targeted predation. Hit ☠ Mass Extinction to trigger a population collapse event. A live average-fitness chart updates with every generation. 🧬 Tab 2 — DNA & Mutation Visualises DNA double-helix replication at the base-pair level (A, T, G, C). A replication fork advances along the strand, and you can choose which type of mutation to observe: point mutation (single base substitution), insertion, deletion, or crossover. Mutated positions are highlighted in pink. GC content and sequence divergence from the original strand are calculated live. 🌿 Tab 3 — Ecosystem A full three-trophic-level food chain — plants → herbivores → carnivores — simulated as a living ecosystem. All three species evolve simultaneously, and Lotka–Volterra population oscillation cycles emerge naturally without any scripting. A real-time population graph at the bottom of the side panel tracks the cycles (green = plants, yellow = herbivores, red = carnivores). Plant regrowth rate, starting herbivore and carnivore counts, and mutation rate are all adjustable. 🔬 Tab 4 — Speciation A single population is split into two groups — A and B — by a geographic barrier (mountain range, ocean channel, or desert). Each group evolves independently under different selection pressures, and their traits (visualised as colour) diverge over generations. Increasing barrier permeability allows gene flow between the two groups, slowing divergence. The genetic divergence bar at the top fills toward 100% as speciation nears completion. 📈 Tab 5 — Phylogeny A radial phylogenetic tree grows automatically every time a speciation event occurs from the common ancestor. Node colour represents genetic distance from the root — green for ancestral lineages, shifting through blue and purple to red for highly diverged species. Extinct lineages are marked with a grey cross. Branching rate, extinction rate, and mutation per branch are all adjustable. Hit ⚡ Adaptive Radiation to instantly trigger a burst of rapid speciation.

🌋 Tab 1 — Fault & Seismic Waves A real-time fault cross-section simulation. Click anywhere on the canvas to set a new epicentre — P-waves (yellow), S-waves (orange), and surface waves (red) immediately radiate outward as concentric rings at their respective speeds. The canvas shows the hypocenter, epicentre, fault line, and a geological cross-section (sediment, granite, lower crust). Ground shaking and soil debris particles spawn as intensity increases. Controls include fault type (strike-slip, reverse, normal), focal depth, and rock hardness. Hit ⚡ Trigger M8.0 to fire a large earthquake instantly. 🏙 Tab 2 — Building Damage Twelve different building types respond to shaking in real time — unreinforced masonry, pre- and post-modern reinforced concrete, timber frame, and modern seismically designed structures progress from vibration to cracking to collapse to rubble. Adjustable parameters: magnitude, soil type (bedrock / sand / soft clay / liquefiable), building code era (1950s to modern), distance from the fault, and shake intensity. A live seismograph waveform runs along the bottom. Collapse rate, heavy damage rate, estimated casualties, and undamaged percentage are all calculated live. 🗾 Tab 3 — Seismic Map A global seismic hazard map with 26 high-risk zones rendered as pulsing hotspots. Tectonic plate boundaries and 14 historical M7+ earthquake records are overlaid — including Tōhoku, Chile, Sumatra, Nepal, and Haiti. A four-tier hazard legend (Extreme / High / Moderate / Low) is shown at the bottom left. 🌊 Tab 4 — Tsunami A cross-section simulation of the full tsunami lifecycle: submarine earthquake → wave generation → shoaling → coastal inundation. The wave travels at ~800 km/h in deep water, then slows and dramatically steepens as it approaches shore — the shoaling effect. Coastal buildings flood and collapse, and the inundation zone advances inland. Adjustable parameters: magnitude, seafloor displacement, ocean depth, coastal slope, and wave speed. Real-time readouts show deep-water speed, runup height, estimated arrival time, and inundation distance. 📊 Tab 5 — Risk Analysis Earthquake risk is calculated as Hazard × Exposure × Vulnerability and displayed on a semicircular gauge dial for four cities: Tokyo, San Francisco, Istanbul, and Kathmandu. Factor bars show each component scored out of 10. A Custom mode lets you define any city profile and simulate its overall risk score and rating (Low / Moderate / High / Critical).

🧊 Tab 1 — Ice Loss Adjust the year slider (1850–2100) and warming scenario (+1–4°C) to watch glaciers melt in real time. As the year advances, the glacier shrinks, crevasses open up, icebergs calve from the front, and meltwater streams run down the surface — all physically simulated. A timeline bar at the bottom shows the current year position. Live readouts display remaining ice percentage, annual loss rate (Gt/yr), and sea level contribution. 🌊 Tab 2 — Sea Level Rise Adjust sea level rise (0–3 m) and storm surge sliders to flood the skylines of five cities — New York, Tokyo, Miami, Jakarta, and Dhaka. Building windows submerge as the water rises and a flood line marks the current level. Population at risk (millions), inundated land area (km²), and economic loss ($T) are all calculated live. 🌡 Tab 3 — Temperature Historical temperature anomaly data from 1850 to 2024 is displayed as a colour-coded bar chart — blue for cool years, red for warm ones. Four future pathways (1.5 / 2.0 / 3.0 / 4.5°C) are overlaid as projection lines extending to 2100. Background shading marks the 1.5°C Paris target, the dangerous zone, and the catastrophic zone. 🌍 Tab 4 — Global Impact The cascading consequences of glacier melt are visualised as an interactive network graph. Nine nodes — glaciers, sea level, freshwater, ice-albedo feedback, permafrost, ecosystems, migration, food security, and economy — are connected by animated flowing edges. Clicking a category button (💧 Freshwater / 🌾 Food / 🐻 Ecosystems / 👥 Human) highlights the relevant impact chain. ⏳ Tab 5 — Future Scenarios Remaining glacier ice from 2024 to 2100 is plotted simultaneously across four warming scenarios (1.5 / 2.0 / 3.0 / 4.5°C). Dragging the year slider moves a vertical probe line and marks each scenario's remaining ice percentage at that point in time. Projected losses by 2100: 49% / 68% / 83% / 94% respectively.

Real WebGL polyhedra rendered with Three.js: a true tetrahedron (d4), cube (d6), octahedron (d8), dodecahedron (d12), and icosahedron (d20). The d10 is modeled as a pentagonal bipyramid — a close, honest stand-in for the kite-faced trapezohedron real d10 dice use, without claiming geometric perfection I can't verify in this build.

World Map Explorer 요약 목적: 나라별 인구와 GDP를 세계지도 히트맵으로 시각화하는 한글 웹 도구 기능 지표 토글: 인구 / GDP 버튼으로 지도 색상, 범례, 랭킹이 즉시 전환 세계지도: d3-geo로 그린 지도에 60개국을 로그 스케일 색상으로 표시 (색 진할수록 값이 큼), 클릭·호버로 상세 확인 국가 검색: 드롭다운으로 국가를 바로 선택해 지도에서 하이라이트 국가 상세정보: 인구, GDP, 1인당 GDP(자동 계산) 상위 20개국 랭킹: 선택한 지표 기준 막대그래프 (스크롤 가능) 데이터: 실시간 API가 아닌, 직접 입력한 60개국의 대략적인 추정치 (정확한 통계는 World Bank 등 공식 자료 참고 필요)

생성형 AI가 사이버 공격의 각 단계에서 어떻게 활용되는지, Lockheed Martin의 Cyber Kill Chain 프레임워크를 기반으로 4가지 방식으로 시각화한 한글 HTML입니다. 실제 공격 실행 방법이나 악성코드는 포함하지 않은 보안 인식 교육용 개념 자료입니다. 01 · 공격 체인: 정찰 → 무기화 → 전달 → 익스플로잇 → 설치 → 지휘통제 → 목표 실행 7단계를 가로 플로우로 표시. 단계 클릭 시 "AI 활용 방식"(빨강)과 "방어 대응"(파랑)이 나란히 표시됩니다. 02 · 공격 흐름 시뮬레이션: ▶ 버튼을 누르면 각 단계가 순서대로 진행되며 터미널 로그 스타일로 상황이 서술됩니다. 03 · 공격-방어 매트릭스: 7단계 전체를 카드 그리드로 펼쳐 공격 측/방어 측 설명을 한눈에 비교합니다. 04 · 단계별 특성 레이더: 단계를 선택하면 탐지 난이도·자동화 수준·잠재적 피해·확산 속도·요구 기술 수준 5개 축을 방사형 차트로 보여줍니다(교육용 예시 수치).

🌊 Tab 1 — Open Ocean Simulates deep-water waves using the Gerstner wave model. Real-time controls for wave count, amplitude, wavelength, speed, choppiness, and wind direction. Four render styles: Classic, Wireframe, Thermal, and Night. Includes foam particles, sun glare, and night-mode starfield with moonlight. Significant wave height (Hs) and period are calculated live. 🏖 Tab 2 — Breaking Surf Physically simulates waves breaking as they enter shallow water. The Iribarren number determines the break type automatically — Spilling, Plunging, or Surging. Adjustable beach slope, wave height, period, wind strength, and foam density. Includes a foam particle system and spray particle physics. Breaking depth is displayed in real time. 🌀 Tab 3 — Wave Physics Four physics modes: Superposition — visualises the principle of linear superposition across three panels (Wave 1, Wave 2, and their sum) Interference — shows constructive and destructive interference as the phase offset changes Standing Wave — incident + reflected wave combination, with nodes highlighted in yellow Fourier — decomposes a square wave into odd harmonics in real time, with a frequency spectrum bar chart that auto-builds harmonic by harmonic 🌍 Tab 4 — Deep Sea A vertical cross-section from the surface to the seabed. Depth zones are clearly delineated: sunlight zone (0–200 m), twilight zone (200–1000 m), midnight zone (1000–4000 m), and abyssal zone. Visualises light ray penetration, suspended particles, bioluminescent organisms, and a hydrothermal vent on the seabed. Water temperature and light level update live with depth. ⛈ Tab 5 — Storm A fully developed storm sea based on the JONSWAP spectrum. Wind speed input automatically determines the Beaufort scale rating (0–12). Features multi-layer storm waves, dynamic storm clouds, rain physics, foam streaks, and a branching lightning algorithm. Every visual element scales in intensity with wind speed.

🎨 Explorer — Select from 16 presets and the tree renders instantly. Six sliders give real-time control over iteration count (n), angle, segment length, length ratio, line width, and taper. Pan by dragging the canvas, zoom with the mouse wheel. Live stats show segment count, branch count, and total string length. ✏️ Custom Editor — Type your own axiom (starting string) and production rules to build a custom L-System from scratch. Rules can be added or removed dynamically, and the generated string is previewed live beneath the editor. 🖼 Gallery — All 16 presets rendered as thumbnails in a grid. Click any card to jump to the Explorer and start exploring that system. 📖 How It Works — A full written tutorial covering the theory behind L-Systems: the three components (alphabet, axiom, rules), a symbol reference table, step-by-step string expansion examples, and code blocks for famous L-Systems. 16 Presets Binary Tree, Plant A, Plant B, Barnsley Fern, Shrub, Pine Tree, Palm Tree, Weeping Willow, Coral, Seaweed, Spiral Plant, Koch Snowflake, Dragon Curve, Sierpiński Triangle, Hilbert Curve, Gosper Curve 8 Color Styles Forest, Autumn, Neon, Snow, Cherry Blossom, Ocean, Fire, Pastel ▶ Grow — Automatically increments the iteration count from 1, animating the tree as it grows branch by branch. 📷 Save — Export the current canvas as a PNG. 🌙 / ☀️ — Toggle between dark and light themes.

🪐 Orrery Real-time orbital simulation using logarithmic distance scaling. Click any planet to reveal its age, formation date on the Cosmic Calendar, orbital period, surface temperature, gravity, and an age-bar showing what percentage of the Universe's lifetime it has existed. Sliders control simulation speed, orbit ring opacity, and planet display scale. Saturn's rings and the Moon's orbit are rendered separately. ⏳ Cosmic Clock Carl Sagan's Cosmic Calendar — 13.8 billion years compressed into a single year. A circular clock face marks key events from the Big Bang to the present: galaxy formation, the Sun igniting, Earth's birth, the Cambrian Explosion, dinosaurs, and the appearance of humans. The current real-world time updates live at the centre every second. 📅 Timeline 22 major cosmic events from the Big Bang to the present, laid out on a horizontal timeline. Labels alternate above and below the axis for readability. A scrollable side panel provides a detailed description of each event alongside its age in billions of years. ⚖️ Age Compare Horizontal bar chart comparing the ages of the Universe, the Milky Way, the Sun, all eight planets, and the Moon. Each bar shows how many billion years after the Big Bang the object formed, its age as a percentage of the Universe's total age, and its equivalent position on the Cosmic Calendar in months. 🌡 Properties Five switchable data modes — Size, Temperature, Gravity, Density, and Moon count — displayed as bubbles positioned along a logarithmic distance axis. Bubble size and colour update instantly when switching modes, letting you compare the physical extremes of the Solar System at a glance.

This is an English HTML that visualizes the water cycle in four different ways. 01 · Live Scene — In a landscape with a sun, ocean, mountain, and river, this shows a real-time animation of water vapor rising from the ocean as the sun heats it, clouds condensing and eventually saturating to release rain over the mountain, and the river flowing back down to the ocean. The "Sun intensity" slider lets you control the evaporation rate. 02 · Process Loop — A circular diagram connecting Evaporation → Transpiration → Condensation → Precipitation → Infiltration → Runoff/Collection. Clicking each stage displays its description. 03 · Earth's Water — A donut chart showing the actual distribution of Earth's water (oceans 96.5%, glaciers 1.74%, groundwater 1.69%, surface water 0.06%, atmosphere 0.001%), based on approximate USGS figures. 04 · Stages — Each of the six stages is explained in a card with an accompanying icon.

01 · Generate Electromagnetic induction: Shows a magnet rotating next to a coil to induce alternating current (AC), visualized through animation and a live oscilloscope waveform. Adjustable via a rotation speed slider. Photovoltaic effect: Visualizes photons striking a solar panel, freeing electrons that flow through the wiring to spin a motor (fan). Adjustable via a sunlight intensity slider. 02 · Store Battery: Shows the anode/cathode and electrolyte of a chemical cell, and how the charge level drops as electrons flow through the external circuit when a load is connected. Capacitor: Using charge/discharge buttons, visualizes how charge builds up and drains between the plates (the RC time-constant curve) through field lines and a charge-level gauge. 03 · Use Ohm's law circuit: Adjusting the voltage and resistance sliders calculates the current via V=IR, with electron flow speed and bulb brightness responding in real time.

🌠 Tab 1 — Classic The core meteor shower visualisation against a night sky backdrop. Each meteor has its own independent speed, trail length, and brightness, with gradient trails that fade naturally. Includes a Milky Way band background. The Rate slider adjusts the spawn rate from 5 to 120 meteors per minute. A live counter at the bottom shows total count, currently active meteors, and estimated hourly rate. 🌍 Tab 2 — Radiant Point Visualises the perspective effect that makes all meteors in a shower appear to radiate from a single point — the radiant. Choose from four real meteor showers: Perseids, Leonids, Geminids, and Orionids. A perspective projection accelerates meteors as they move away from the radiant, just as parallel lines converge at a vanishing point. The radiant position, entry speed, and peak date are displayed for each shower. 💥 Tab 3 — Impact Simulation A physics simulation from atmospheric entry through to ground impact. Meteor colour shifts from blue-white to red as friction heats it during descent. On impact: debris fragments with gravity and restitution, expanding shockwave rings, and a crater. Three scale presets: Pebble (centimetres), Boulder (metres), and Bolide (10 metres). 🔭 Tab 4 — Spectrograph An elemental spectral analysis tool for meteors. Sliders control the emission intensity of four elements — Mg (blue-white), Na (orange), Fe (red), Ca (cyan) — and both the meteor trail colour and the emission lines in the spectrum panel at the bottom update in real time. Each line is positioned at its correct wavelength (nm) against a true-colour rainbow spectrum background. 🪐 Tab 5 — Solar System Shows the orbital mechanics behind meteor showers: Earth crossing the debris trail left by a comet along its orbit. Collision events are counted as Earth passes through the yellow debris cloud. The comet tail direction is calculated dynamically to always point away from the Sun, and Earth's orbital year is displayed in real time.

🌌 Tab 1 — Curtains Recreates the folded curtain structure of real auroras. Six glowing ribbons ripple like waves, each particle dancing with its own independent phase and velocity. Visualises how solar particles spiral down along Earth's magnetic field lines, exciting oxygen and nitrogen atoms to emit their characteristic light. 🌀 Tab 2 — Vortex The auroral corona as seen looking straight up at the magnetic pole. Particles spiral inward along converging field lines, and the Arms slider lets you adjust the spiral structure from 1 to 8 arms. Built on Float32Array typed arrays for smooth handling of 1,200 particles with minimal memory overhead. ✨ Tab 3 — Particle Storm Simulates a Kp-9 extreme geomagnetic storm — the most intense class of aurora event. Four modes: Cascade — solar particles raining down from above Explosion — particles bursting outward from a central point River — a flowing stream of particles channelled along magnetic field lines Neural — plasma connecting between nodes like a living neural network 🎵 Tab 4 — Resonance Visualises the Schumann resonance of Earth's ionosphere (7.83 Hz). Aurora particles vibrate in sync with the planet's own electromagnetic frequency. Raising the Harmonics slider adds more complex waveforms in superposition. Pulsing rings and particles move in perfect phase synchronisation. ❄️ Tab 5 — Arctic Scene A complete Arctic night scene. Twinkling starfield, moonlight glow, three-layer aurora, snow-dusted tundra silhouette, pine tree shadows, ice surface shimmer, and wind-driven snowfall — all capturing the atmosphere of Tromsø, Norway or Fairbanks, Alaska on a clear winter night.

📊 탭 1 — 핵심 확률 KPI 4개: 화석화 확률(0.00001%), 지표 노출(1/1천만), 발견·수집(1/10억), 현재 명명 종 수(~1,000종) 단계별 확률 감소 바 차트 (로그 스케일) 도트 매트릭스 2개: 1만 마리 중 화석화 1개 / 화석 1,000개 중 발견 1개 1억 마리 공룡으로 시작하는 퍼널 차트 🔬 탭 2 — 단계별 분석 사망→매몰→광물화→지각 생존→노출→파손 방지→발견까지 7단계 막대 그래프 각 단계 설명 카드 6장 서식 환경별 화석화 성공률 비교 (강·호수 85% ~ 오픈 평원 5%) 🌍 탭 3 — 지역별 발견율 대륙별 누적 발견 종 수 막대 그래프 (중국 350종 1위) 지역 카드 6장 (면적당 밀도 포함) 1824~2024년 신종 기재 누적 꺾은선 그래프 (시대별 에라 배경 포함) ⚖️ 탭 4 — 비교 시각화 공룡 화석 발견 vs 로또 1등·번개·비행기 사고 확률 로그 스케일 비교 화석 유형별 희귀도 버블 차트 (이빨~피부 인상 8종) 지질시대별 화석 발견 밀도 타임라인 (트라이아스기~백악기 후기) 🧮 탭 5 — 확률 계산기 6개 조건(서식 환경·개체 크기·뼈 밀도·퇴적 속도·경과 시간·탐사 접근성) 설정 실시간 확률 계산 및 탐사 접근성 곡선 업데이트 시나리오별 예상 확률 카드 6장 (이상적 조건~깃털 인상) 확률 계산 공식 및 참고 문헌 표시

A genealogical map of how today's Indo-European languages descend from a shared ancestor. Click any branch to expand or collapse it, or search for a language to trace its lineage back to the root.

π (pi) is the ratio of a circle's circumference to its diameter — the same number, no matter how big or small the circle. Below are four different ways people have calculated it, from ancient geometry to modern random sampling. Drag the sliders and press the buttons to see each one work.

This is an HTML page that visualizes an animated Perlin noise field in real time, styled as a terrain (contour) map. Canvas: 3D Perlin noise (x, y, time) is computed per pixel using fBm (octave summation) and mapped to terrain colors (water–sand–grassland–forest–rock–snow). Hovering the mouse over the canvas shows the noise value at that coordinate in real time. Controls: Scale, Octaves, Persistence, and animation speed sliders / Terrain·Thermal·Grayscale palette switcher / Contour bands toggle / a Reseed button to generate a new terrain.