Ordered as made, from the first studies to the latest pieces.
 Shadow Square p0 · geometric |
 Bisected Square p1 · geometric |
 Diagonal in a Box p2 · geometric |
 Random Diagonals p3 · interactive |
 Diagonal Tiles p4 · tiling |
 Tiling Lines p5 · tiling |
 Displaced Lines p6 · geometric |
 Jittered Dots p7 · geometric |
 Displaced Rows p8 · generative |
 De Casteljau p9 · bezier |
 Tiling Curves p10 · tiling |
 Noise Curves p11 · perlin-noise |
 Joy Division Logo p12 · generative |
 Drifting Splines p13 · generative |
 Noise Curtain p14 · flow-field |
 Random Tiles p15 · tiling |
 Rotated Grid p16 · geometric |
 Drifting Curves p17 · generative |
 Tile Drift p18 · recursion |
 Triangle Fractal p19 · recursion |
 Eye of Sauron p20 · recursion |
 Chromatic Tiles p21 · tiling |
 Twisted Pipes p22 · generative |
 Braided Pipes p23 · generative |
 Silky Drift p24 · generative |
 Fractal Circles p25 · fractal |
 Flow Field p26 · flow-field |
 Mona Lisa Circles p27 · halftone |
 Mona Lisa Rings p28 · image-sampling |
 Mona Lisa Lego p29 · pixel-art |
 Audio Spectrum p30 · audio |
 Maze Escape Path p31 · geometric |
 Parametric Flower p32 · webgl |
 Camellia Cloud p33 · webgl |
 Camellia Tetrahedron p34 · webgl |
 Calico Logo p35 · logo |
 Pavilion on Fire p36 · halftone |
 Dystrophin Poster p37 · image |
 Folded Grids p38 · after John Walker, 2008 |
 Folding Grid p39 · geometric |
 Vanish p40 · after Sol LeWitt, 1994 |
 Ring & Cross p41 · after Sol LeWitt |
 Wall Drawing #821 p42 · after Sol LeWitt, 1997 |
 Painting, Blue p43 · after Ad Reinhardt, 1953 |
 Painting, Black p44 · after Ad Reinhardt, 1960s |
 Shape Library p45 · grid |
 Seven Colors p46 · grid |
 Accent Block Grid p47 · grid |
 Shape Browser p48 · svg |
 2×2 Block Grid p49 · grid |
 Color Accent Grid p50 · grid |
 Shape Mosaic p51 · geometric |
 18 Compositions p52 · grid |
 Six Compositions p53 · grid |
 Shape Collage p54 · grid |
 Density Gradient p55 · grid |
 Scale & Overlap p56 · collage |
 Order to Chaos p57 · grid |
 Shape Packing p58 · packing |
 Mondrian Split p59 · recursion |
 Radial Ripples p60 · concentric |
 Converging Grid p61 · after Pixel Symphony, 2025 |
 DAC Badges p62 · generative |
 Cathedral Glass p63 · three.js |
 God-Ray Falloff p64 · three.js |
 Leaded Glass Dome p66 · three.js |
 3 Carrés Noirs p67 · after Vera Molnár, 1950 |
 Central Gravity p68 · after Milan Dobeš, 1965 |
 Double Progression p69 · after Julio Le Parc, 1959 |
 Brix p70 · after Horacio García Rossi, 1959 |
 Equal & Unequal p71 · after Anton Stankowski, 1951 |
 Pleated Checkerboard p72 · after Sarilotto, 1978 |
References
Several pieces are faithful recreations of existing works, studied by rebuilding them in code:
- Folded Grids — after John Walker, 2008
p38 - Vanish — after Sol LeWitt, 1994
p40 - Ring & Cross — after Sol LeWitt
p41 - Wall Drawing #821 — after Sol LeWitt, 1997
p42 - Painting, Blue — after Ad Reinhardt, 1953
p43 - Painting, Black — after Ad Reinhardt, 1960s
p44 - Converging Grid — after Pixel Symphony, 2025
p61 - 3 Carrés Noirs — after Vera Molnár, 1950
p67 - Central Gravity — after Milan Dobeš, 1965
p68 - Double Progression — after Julio Le Parc, 1959
p69 - Brix — after Horacio García Rossi, 1959
p70 - Equal & Unequal — after Anton Stankowski, 1951
p71 - Pleated Checkerboard — after Sarilotto, 1978
p72
The early line-and-grid studies (p0–p8) follow exercises from Tim Holman's Speedrunning through p5.js talk.
Run it locally
npm install
npm run dev # http://localhost:3000A React + Vite gallery loads each sketch in an isolated iframe (p5.js from CDN). Use the arrow keys or the control panel to move between pieces; press S to save the current frame as a PNG.
How it's built
- Sketches live in
artworks/as vanilla p5.js / three.js scripts (p0.js…p72.js). - A small Vite plugin scans that folder and auto-generates the gallery manifest — adding a file is all it takes.
- The thumbnails above are rendered headlessly straight from the live sketches (see
scripts/capture_gallery.py).