You are not looking at drawings — you are looking at rules. Every image on this page is a few lines of mathematics, run live in your browser: nothing is a photo, and nothing was drawn by hand. Choose a rule, and form falls out. What follows is one argument in five chapters — from a single equation, to many at once, to a signed print, to the same math alive on your GPU, to a rule of your own — and every piece can leave the screen as plotter-ready ink.
One rule. Start with the smallest case — a single equation, traced stroke by stroke. One rule, one image: proof that a single line of math already holds a whole picture. Turn a knob and watch the rule move.
If one rule can hold an image, what happens when many share a frame?↓
Many rules, one frame. Let a whole family occupy the same sheet — tiles, atlases and subdivisions. A single voice becomes a chorus, and the page fills with variations on a theme.
Enough rules to fill a page — now layer them into a single, signed plate.↓
Rules, composed and pulled. Layer several into one plate — background, hero, accent — and close it the way an etching is signed. A rule becomes a finished, repeatable print.
A finished print sits still. It doesn't have to.↓
Rules, set loose. Hand the same ideas to your graphics card — a tiny rule per pixel, sixty times a second, never quite repeating. Form that computes itself in real time.
You've seen what rules can do. Time to write one of your own.↓
Your rule. The gallery is a codebase, not a black box — every piece is one small function. Fork it, write a rule, and it joins the collection already wired with sliders, shuffle, a lightbox, permalinks and plotter-ready SVG export.
The whole workflow is one generator function dropped into src/art/collection.js. Each yield plots one step on screen — and the same code is replayed into vector paths for the SVG export, so an AxiDraw or any pen plotter can draw your rule in real ink. No build step, no framework: plain ES modules a browser runs as-is.
src/config.js.*draw() generator.Compositions, editions and shaders are added exactly the same way — one entry in the matching file. The contributor guide walks through each.
// a new artwork = one object in src/art/collection.js { title: "Hypotrochoid №7", equation: "x=(R−r)cosθ + d·cos(((R−r)/r)θ)", params: [ { key:"r", label:"inner gear", min:20, max:95, step:1, value:55 }, { key:"d", label:"pen offset", min:10, max:90, step:1, value:70 }, ], *draw(ctx, w, h, p, rng) { // your equation goes here; // `yield` now and then → it plots itself live, // and the same code becomes your SVG for the plotter } }
No framework, no build step — the whole site is plain ES modules a browser runs as-is. Each plotted piece is one seeded generator function, and a single fake canvas context replays it into vector paths, so the drawing you see and the SVG you export are guaranteed to be the same lines. The moving pieces are fragment shaders your GPU runs per pixel, sixty times a second.
Set in Spectral and IBM Plex Mono. Every plotted piece exports as plotter-ready SVG with the paper background on its own layer — delete it and send the rest to a pen. Released under the MIT license; fork it and sign it with your own name.