How to Add a Reaction-Diffusion Simulator to Your Website
LK Forge · 4 min read · Updated September 2026
You can add a live Gray-Scott reaction-diffusion simulator to any website, blog, or classroom page with a single line of code — free, with no sign-up, no plugin, and no script to install. Spots, stripes, mazes and coral grow themselves out of nothing but two chemicals spreading and reacting — the classic demonstration of Turing patterns, where a fast diffuser and a slow one break their own symmetry into structure. This guide covers the fastest way to embed the tool, what it shows, and where it works.
The quickest way: paste one embed snippet
An embed is just an <iframe> that loads the simulator from lkforge.com, plus a small credit line. Copy this into your page’s HTML where you want the widget to appear:
<iframe src="https://lkforge.com/embed/reaction-diffusion/"
width="100%" height="1000" loading="lazy"
style="border:0;max-width:560px"
title="Reaction-Diffusion by LK Forge"></iframe>
<p><a href="https://lkforge.com/tools/physics/reaction-diffusion/">Reaction-Diffusion</a>
by <a href="https://lkforge.com/">LK Forge</a></p> The <iframe> is the live simulator; the <p> underneath is a plain credit link. Keep that line — the visible link is what keeps the widget free to embed. You can also copy this exact code straight from the LK Forge widget gallery.
What the widget shows
The canvas opens already reacting, so a visitor sees a pattern forming immediately and can then take control:
- Feed and kill dials: two sliders shift the chemistry live, moving the pattern from mazes and coral through to discrete spots.
- Paint your own fronts: drop fresh blobs of chemical V onto the canvas and watch a new reaction front nucleate and organise itself.
- Preset regimes: jump straight to Spots, Stripes, Maze, Coral, Mitosis or Waves without hunting for the right f and k by hand.
- Speed and clear: set how many simulation steps run per frame, and wipe the canvas to start a fresh pattern from scratch.
Pick the right height
The snippet uses height="1000", which fits the canvas, the sliders and the preset buttons without clipping even on a narrow phone, where they stack into one column below the pattern. On a wider page the widget centres within its max-width:560px. That single height works across screen sizes, so there is nothing to tweak for mobile.
Where it works
Because it is a standard iframe, the embed works anywhere you can add HTML:
- WordPress: add a Custom HTML block and paste the snippet.
- Squarespace: use a Code / Embed block.
- Wix: add an Embed HTML / iframe element.
- Ghost: insert an HTML card.
- Notion: paste the
/embed/reaction-diffusion/URL and choose "Create embed". - Plain HTML, an intranet, or a lesson page: paste the snippet straight into the markup.
That’s the whole job. Copy the embed code from the widget gallery and paste it wherever a lesson or a blog post on Turing patterns, self-organisation or the mathematics of animal coats needs a simulator students can actually paint on.
Grab the embed code from the LK Forge widget gallery — free, no sign-up.
Open the Reaction-DiffusionFrequently asked questions
- What can visitors do with the embedded reaction-diffusion widget?
- They can tune the feed rate f and the kill rate k with two sliders and watch the pattern reorganise, paint fresh blobs of chemical V straight onto the canvas to nucleate new fronts, and jump between preset regimes — Spots, Stripes, Maze, Coral, Mitosis and Waves. A speed slider sets how many simulation steps run per frame, and Clear resets the canvas.
- What model is running under the hood?
- It is the Gray-Scott model. Chemical U is fed in everywhere, the reaction U + 2V → 3V converts it into V, and V is steadily removed. Both chemicals diffuse, but U spreads about twice as fast as V. Each cell updates from just its neighbours, so a simple local rule applied everywhere at once builds the whole pattern.
- Why do the feed and kill rates change the pattern so much?
- Those two dials decide everything. A low kill rate lets V spread out into mazes and coral, a higher kill pinches it into discrete spots, and special balances make cells that keep dividing or fronts that travel as waves. Nudging f and k is how you move between every regime, which is exactly what the presets do for you.
- What iframe height should I use, especially on mobile?
- The snippet ships with height="1000", which is tall enough that the canvas, the sliders and the preset buttons all fit without clipping even on a narrow phone, where the controls stack into a single column below the pattern. On a wider page the widget simply centres within its max-width of 560px, so the same height works across screen sizes.