The Vibeary — round-up
Best creative coding frameworks
Creative coding tools optimise for a different loop than product frameworks: fast iteration, deterministic randomness, easy export at print resolution, and getting out of the way while you tune parameters. This shelf covers sketch environments, generative-art toolkits, canvas and 2D rendering libraries, and the utility packages — seeded randomness, geometry, colour maths — that make a generative system reproducible instead of a one-off screenshot.
What earned a place
- Fast feedback loop from edit to visual
- Seeded randomness so outputs are reproducible
- Export at real resolution for print or video
- Small enough to read the source
24 picks from the library
- 01
Blot
Open source pen-plotter drawing machine paired with a browser editor where art is written as code and submitted to a gallery.
Why it made the list: Hardware plus editor plus curriculum, all open; rare complete generative-art pipeline
Creative codingMITHack Clubblot.hackclub.com
- 02
canvas-sketch
Framework and CLI for generative artwork in JavaScript with deterministic seeding, print-resolution export and video recording.
Why it made the list: Handles seeds, print sizing and export: the boring eighty percent of generative tooling.
Creative codingMITMatt DesLauriers (@mattdesl)github.com
- 03
canvas-sketch-util
Utility package of seeded random, geometry, colour, math and shader helpers extracted from the canvas-sketch workflow.
Why it made the list: Usable standalone; the seeded-random module alone justifies pulling in the dependency.
Creative codingMITMatt DesLauriers (@mattdesl)github.com
- 04
compute.toys
Browser playground for WGSL compute shaders: write, run and publish GPU compute experiments with a public gallery of other people's sketches.
Why it made the list: Shadertoy's compute-shader cousin, and far fewer people know it exists.
Creative codingopen-sourcecompute-toyscompute.toys
- 05
Constellation Dice
Unity URP glass die with a nebula and per-face constellations, all raymarched in one pass on the default cube.
Why it made the list: Eight verts, one raymarch pass — glass, volume sheets and constellations without extra geometry.
Creative codingMIT@tantaneitygithub.com
- 06
css-doodle
Web component that generates CSS-only patterns and grids from a compact declarative rule language with built-in randomness.
Why it made the list: Generative art with no canvas or WebGL at all; absurdly small payload.
Creative codingMITYuan Chuan (@yuanchuan23)css-doodle.com
- 07
Driftcha
Experimental CAPTCHA where every single frame is pure static noise and the digits only become visible through the motion between frames.
Why it made the list: A screenshot shows nothing; the message exists only in motion. Clever perception trick.
Creative codingMIT@kaihong66kaihong66.github.io
- 08
EZ-Tree
Open-source procedural tree generator with a browser editor and a Three.js runtime library, exporting GLB models.
Why it made the list: Parametric trees you tune visually and export; huge time save for any outdoor scene.
Procedural generationMITDan Greenheck (@dgreenheck)eztree.dev
- 09
Fantasy Map Generator
Browser application generating interactive fantasy world maps with heightmaps, cultures, states, religions and exportable data.
Why it made the list: Generates political, cultural and terrain layers, not just pretty coastlines
Procedural generationMITAzgaar (@Azgaar)github.com
- 10
ff-tracking
Six-second motion piece rendered entirely in code with fframes: a virtual camera films an agent's terminal through one SkSL lens shader while trackers lock onto glyphs.
Why it made the list: A fully readable two-pass shader camera pipeline you can retarget by editing one scene list.
Creative codingMITMustafa Saraç (@0xsarac)github.com
- 11
Fragment
Local web environment for live-coding fragment shaders and sketches with hot reload, GUI controls and video export.
Why it made the list: Local-first shader live coding with recording built in; tiny star count, great craft.
Creative codingMITRaphael Ameaume (@raphaelameaume)github.com
- 12
Golden Temple
Golden-hour Japanese temple complex built entirely in three.js code, 24 million triangles with procedural GLSL materials, rendered offline into a 70-second 1080p60 film.
Why it made the list: No models, textures or HDRIs, plus the headless render and flicker-check tooling to study.
Procedural generationMIT@Leonxlnxgithub.com
- 13
graph-dungeon-generator
Graph-based procedural dungeon generator in TypeScript that places rooms from a connectivity graph with a readable implementation.
Why it made the list: Small enough to read in an afternoon and adapt to your own room grammar
Procedural generationMIThalftheoppositegithub.com
- 14
Lemo Opuscar
Forty-three film styles as reusable prompts plus short films directed, drawn and scored entirely in code by Claude Opus, ready for agents to remix.
Why it made the list: A style bible of code-made films, not another prompt dump.
Creative codingMITLemoLab (lemomo-ai)lemomo-ai.github.io
- 15
Machine Vision
Browser visual instrument that turns local video into procedural points, brackets, labels and tracking overlays, then exports a five-second composite clip.
Why it made the list: Local-only analysis with no server — bring any clip, leave with a treated export.
Creative codingMITAmir Mushichmachine-vision-seven.vercel.app
- 16
MarkovJunior
Probabilistic programming language for generative art and level design based on rewrite rules and constraint propagation.
Why it made the list: 153 worked examples turn generative level design into a readable rule language
Procedural generationMITMaxim Gumin (@ExUtumno)github.com
- 17
morphogenesis-resources
Curated reference of algorithms for growth and form — diffusion-limited aggregation, reaction-diffusion, L-systems, space colonization.
Why it made the list: The single best index of organic-growth algorithms with visual examples per technique
Procedural generationopen-sourceJason Webb (@jasonwebb)github.com
- 18
ndwfc
N-dimensional wave function collapse with an infinite, lazily-expanded canvas rather than a fixed output grid.
Why it made the list: Infinite lazy generation unlocks endless scrolling worlds that classic WFC can't do
Procedural generationMITLingdong Huang (@LingDong_)github.com
- 19
Newton's Orchard
Browser gravity playground with deterministic time scrubbing, fully editable bodies, preset solar systems, unlockable missions and a user-submission gallery.
Why it made the list: Scrub orbits backwards deterministically — a real step past the PhET sims.
Creative codingopen-sourceAndrew Childs (@andrewchilds)newtonsorchard.app
- 20
Particles4All
WebGPU solver that simulates fluid and rigid bodies as one position-based-dynamics system, with screen-space fluid surface reconstruction.
Why it made the list: Research-grade PBF solver with every knob exposed live in the browser.
Creative codingMITmatsuoka-601 (@matsuoka_601)particles4all.netlify.app
- 21
Pts.js
TypeScript library for composing points, vectors, curves and interaction into visualizations rendered to canvas or SVG.
Why it made the list: Geometry-first API that makes spatial thinking natural instead of imperative drawing calls.
Creative codingApache-2.0William Ngan (@williamngan)ptsjs.org
- 22
Pulsar
Micro creative-coding playground where you edit a short expression and switch between classic, hex and triangular tilings to make generative loops.
Why it made the list: Tiny enough to learn in a minute, deep enough to lose an afternoon in
Creative codingfreeStanko Tadić (@stankot)muffinman.io
- 23
py5
Processing reimplemented for Python 3 with direct interoperability with NumPy, Matplotlib, Pillow and Jupyter notebooks.
Why it made the list: Processing's API without leaving the scientific Python stack you already use
Creative codingopen-sourceJim Schmitz (@hx2A)py5coding.org
- 24
rot.js
Roguelike toolkit for JavaScript with map generators, field of view, pathfinding, scheduling, RNG and display abstraction.
Why it made the list: Twenty years of roguelike algorithms — FOV, dungeons, scheduling — in one JS package
Procedural generationopen-sourceOndřej Žára (@0ndras)github.com
Questions
- Canvas or SVG for generative work?
- Canvas for thousands of elements and pixel effects; SVG when you need crisp scaling or want to edit the output in a vector tool afterwards.
- How do I make generative art reproducible?
- Use a seeded random function and store the seed with the piece. Every serious toolkit here supports it.