Algo-Art Gallery

Ten generative systems — attractors, flow fields, a signed-distance garden, a four-mode "Relativity Engine" — each seeded so it renders the same image every time. Hover to run it live.

p5.jsThree.jsGLSLSVG
play ▸
running live — it's yours to play withopen fullscreen ↗

move your mouse to push the fluid — press S to save a frame.

The idea

A gallery of small generative systems — programs that draw their own pictures. Each one sets up a handful of rules and lets the image emerge: a strange attractor traces a glowing flame, a flow field combs thousands of particles into hair-like currents, a signed-distance field grows a soft 3D garden.

The throughline is reproducibility. Every piece takes a seed, so the same input always produces the same image — these aren’t one-off renders, they’re re-runnable systems you can version, tweak, and re-roll. Change one parameter and a whole new family of images appears.

They’re also deliberately portable. Each piece is a single self-contained HTML file with no build step — which is exactly why they can run live, right here on this page, the same way they’d run in a gallery kiosk.

How it works

Four substrates

p5.js for 2D canvas, Three.js for WebGL 3D, raw GLSL fragment shaders, and SVG for plotter-ready vector output.

Seeded & reproducible

A seed drives every random choice, so any image can be regenerated exactly — or evolved by nudging the seed.

Techniques

Clifford strange attractors, flow fields, signed-distance fields, instanced geometry, and a four-mode "Relativity Engine" (contours, duotone, flow).

Zero-install

Each piece is one standalone HTML file pulling libraries from a CDN — runs anywhere, embeds live.

Gallery

What’s next

Expanding the set and adding an evolutionary mode — pick the images you like and let the system breed the next generation.