Home▸Chemistry & Materials▸2D Reaction-Diffusion (Gray-Scott)

🧫 2D Reaction-Diffusion (Gray-Scott)

A genuine 2D Gray-Scott reaction-diffusion PDE solved on a discrete grid with a real 9-point Laplacian, plain canvas pixels instead of a GPU shader. Feed/kill presets switch between spots, stripes, mitosis and maze patterns.

Chemistry & Materials2DModerate60 FPS📱 Mobile-adapted⇄ 3D version

Details

CategoryChemistry & Materials

RenderingCanvas 2D

DifficultyModerate

Target FPS60

ControlsFeed rate (f) and kill rate (k) sliders (0.01-0.1 and 0.03-0.075) directly tune the PDE parameters; a speed slider sets PDE steps per animation frame (1-24). Five presets (Spots, Stripes, Mitosis, Maze, Coral) jump to known f/k combinations and reseed the grid. A palette selector recolors the display, Reset grid reseeds from the centre, Add seed drops a fresh random blob, Pause freezes the simulation, and clicking or dragging on the canvas injects chemical V at the cursor.

reaction diffusiongray-scott modelturing patternscellular griddiscrete laplacian2d

Related simulations

Diffusion-Limited Crystal Growth SimulationExplore the formation of a crystal through random particle movement, adjusting parameters…

Acid-Base EquilibriumPerform a virtual acid-base titration: add drops of strong base to a weak acid and watch the…

Chemical Reaction Kinetics — Arrhenius & Consecutive ReactionsSimulate A→B→C consecutive chemical reactions in real time. Explore the Arrhenius equation,… ⊞ All 777 in Chemistry & Materials →

What It Demonstrates

The same Gray-Scott reaction-diffusion chemistry as the 3D shader version, but solved with a real, inspectable numeric loop on a plain 2D canvas: two chemicals U and V diffuse across a 128×128 grid and react, self-organising into spots, stripes, mazes and self-replicating blobs purely from local rules.

How to Use

Click or drag on the canvas to seed chemical V at the cursor. Drag the feed rate (f) and kill rate (k) sliders to switch pattern families, or jump straight to a preset. The Speed slider sets PDE steps per frame; Pause freezes the grid so you can inspect a frozen pattern.

Did You Know?

Unlike the GPU shader version, this simulation updates every one of its 16,384 grid cells with an explicit JavaScript loop each step — genuinely computing the same nine-point discrete Laplacian a fragment shader would, just on the CPU where you can read the exact arithmetic in the page source.

⚙ Under the hood

A genuine 2D Gray-Scott reaction-diffusion PDE solved cell-by-cell on a 128x128 grid with a real discrete 9-point Laplacian, rendered on a plain canvas instead of a GPU shader. Feed/kill presets switch between spots, stripes, mitosis and maze patterns, and clicking or dragging injects chemical V by hand.

reaction diffusiongray-scott modelturing patternscellular griddiscrete laplacian2d

2D · HTML5 Canvas 2D · 60 FPS target · runs fully client-side, no install