finds.dev← search

// the find

mattdesl/canvas-sketch

★ 5,299 · JavaScript · MIT · updated Jun 2026

[beta] A framework for making generative artwork in JavaScript and the browser.

canvas-sketch is mattdesl's framework for generative art in JS — a small core library plus a CLI (canvas-sketch-cli) that scaffolds sketches, handles hot reload, and exports high-DPI PNGs or pen-plotter SVGs. It's aimed at creative coders who want print-quality output (physical units, exact DPI) rather than just a canvas on a webpage.

The physical-unit handling (inches/mm, pixelsPerInch, paper sizes like A4) is the actual differentiator — it correctly maps canvas pixels to print DPI, which most canvas libraries just ignore. It's framework-agnostic: templates exist for Three.js, p5, regl, and Two.js, so you're not locked into one rendering approach. The example folder has 40+ real sketches covering animation, WebGL shaders, and SVG plotter output, which is more useful than API docs for this kind of tool. Hot reloading via the CLI makes iterating on generative parameters fast instead of a full refresh each time.

It's still tagged [beta] and the project's own roadmap admits there are no unit tests and no real API docs — for a library whose core (lib/core/SketchManager.js, createCanvas.js, etc.) is only a handful of files, that's a thin safety net. Most of the actual value lives outside this repo in canvas-sketch-cli and canvas-sketch-util, so cloning just this package gets you less than it looks like. The README still pins node@15.x / npm@7.x as the baseline, which reads as stale even with a recent push date. No TypeScript definitions ship with it, so the settings/props objects passed into the sketch function have no autocomplete or type checking.

View on GitHub →

// want more like this?

We dig through GitHub every week and send a few repos picked for what you actually care about — each with an honest take like this one.

Get finds in your inbox → Search again →