Differential Growth Screensaver
Differential Growth is a free, in-browser generative art screensaver built on the process that folds coral, brain cortex and lettuce edges: a closed loop of nodes that keeps inserting new nodes wherever an edge stretches, while each node is pulled toward its neighbours and pushed away from every other node nearby. With more length than room, the loop buckles, and the buckles buckle, until the whole screen is filled with meandering folds. Nothing to download, and ESC exits at any time.
How the Differential Growth screensaver works
The line begins as a small ring of forty nodes. Every frame three forces act on each node. Attraction pulls it toward its two neighbours along the line, keeping the chain tight. Repulsion pushes it away from any node — neighbour or not — within a small radius, so the line can never pass through itself. Alignment nudges it toward the midpoint of its neighbours, which smooths sharp kinks.
Growth is the fourth ingredient: whenever an edge stretches past a maximum length a new node is inserted at its midpoint, and a few random insertions happen anyway, so the loop gets longer at a steady rate. Repulsion means the added length cannot be absorbed by bunching up, so it goes into folds.
The repulsion check is the expensive part, so nodes are binned in a spatial hash and only nearby bins are searched, which keeps thousands of nodes running smoothly. Nodes are clamped inside the canvas, so the folds pack against the edges as they run out of room.
When the node count reaches the limit the picture fades and a fresh ring starts. With the trail on, a faint history of earlier positions stays on screen, showing how the folds migrated.
Folding from uneven growth
Differential growth is a mechanical idea before it is a biological one. When a thin sheet or layer grows faster than whatever it is attached to, it has nowhere to go except sideways, so it buckles. The same logic is invoked for the folded outer layer of the brain over its core, and for the ruffled edge of lettuce leaves, where excess growth near the margin produces a wavy rim.
In a 2016 Nature Physics study, Tallinen, Mahadevan and colleagues coated a gel model of a fetal brain, built from MRI scans, with a thin gel layer and let it swell in a solvent. The swelling outer layer buckled into folds similar in size and shape to real brain folds, which supports the idea that physical forces play a major part in shaping the pattern.
As an art form, differential growth has been explored in generative design by studios such as Nervous System, whose Floraform project simulates it, and in code by programmers such as Anders Hoff. The appeal is that a few local rules produce organic complexity that looks designed but is not, and no two runs ever fold quite the same way.
A worked example
At the defaults — Growth rate 4, 2600 nodes, Coral palette, trail on — the ring wobbles, sprouts lobes, and within a minute becomes a dense meander that spreads across the screen like a brain seen from above, every fold about the same width. Turn the trail off for a crisp single line; switch to Spectrum to see the hue run along the loop and reveal where the original ring ended up.
Settings & tips
- A higher node limit gives a longer, denser meander before the restart.
- Growth rate 1 turns it into a slow, meditative unfolding.
- The Ice palette on the trail looks like frost creeping across glass.
Frequently asked questions
- Where does differential growth show up in nature?
- Anywhere a surface or edge grows faster than the space it is attached to: coral and lichen fronds, the folds of the cerebral cortex, kale and lettuce leaf edges, intestinal villi. The mismatch in growth rates is what forces the buckling.
- Why do all the folds end up the same width?
- The repulsion radius sets a minimum distance between any two parts of the line, and growth fills every available space down to that distance, so the corridors between folds all converge on roughly that width.
- Will this slow my computer down?
- It is tuned to run smoothly on an ordinary laptop. If it feels heavy, raise the Pixel size or lower the speed in the settings; every control takes effect immediately.
- Is the Differential Growth screensaver free?
- Yes. It runs free in your browser with nothing to download or install, and it keeps working offline once the page has loaded.
- How do I exit the Differential Growth screensaver?
- Press the ESC key at any time to leave fullscreen and return to the page.
- Why does the line never cross itself?
- Every node pushes away from all others within a short distance, so two parts of the line cannot pass through each other. This mirrors how real tissue cannot occupy the same place twice.
- Is this how the brain really gets its folds?
- Mechanical buckling from uneven growth is supported by gel experiments and simulations, but a simple line is only an analogy. Real brain development also involves biology that this model leaves out.
- What does the picture look like if growth never stops?
- The line keeps lengthening within a fixed area, so it crowds ever tighter. Eventually the folds fill the space like a maze, as the stretched line has nowhere left to expand.