Beyond the Canvas
I kept asking myself why.
There are already SVG tools. Vector editors. Libraries that spit out SVG. The web is full of ways to get from code to a file. So why did this keep coming up? Why were people asking for native SVG support in p5.js specifically?
I started paying more attention. Reading forum threads, watching how people actually used the library. And a pattern emerged pretty quickly, one that I hadn't expected.
Nobody was opening p5.js because they wanted an SVG.
They wanted to make something. A generative poster. A plotter drawing. A weird visual experiment that started at 2am and somehow became worth keeping. p5.js was where the making happened. The SVG was just the thing they needed afterward.
You can feel the frustration in old forum threads. A 2019 post on the Processing Community Forum starts simply enough, someone wants to load and display an SVG in p5.js. The answer they get: "p5js doesn't currently support SVG." The thread goes on to suggest workarounds, mixing in separate libraries, managing two canvases, stitching tools together. A Stack Overflow thread from 2016 tells a similar story, someone built a custom font generator in p5.js and just wanted users to download their result as a vector file. The accepted answer involves grabbing the raw SVG element from the DOM and manually triggering a file download. It works, kind of. But it's a hack built on top of a gap, not a solution.
People found ways through. But they were always working around something, not through a door that was actually open.
The interesting moment is right after the sketch works.
Say you've been running variations for an hour. You've generated hundreds of compositions, most of them wrong in some way, and then one of them just lands. The proportions feel right. The density is right. Something about it works. So now what?
Maybe you want to nudge a few shapes in Inkscape. Maybe you want to send it to a pen plotter. Maybe you want to drop it into a poster layout. The sketch has done its job, but the project isn't finished.
And this is exactly where things got frustrating. The easiest thing to do is hit save and export a PNG. PNGs are fine if you're posting something online. But they're a dead end if you want to keep working. Once your sketch is pixels, the structure disappears. The thing you made is still there, but the material is gone.
What I realized is that the problem wasn't really about file formats. It was about something more basic: people wanted the work to survive the sketch.
p5.js is where ideas take shape. But for a lot of people, that's just one stop in a longer process. A generative artist wants to refine a favorite result. A plotter artist wants to go from code to paper without rebuilding anything. A designer wants to generate raw material in code and finish it somewhere else. The sketch is a starting point, not a destination.
That's what native SVG support is actually for. Not exporting a file. Keeping the work alive past the moment the sketch stops running.
Version 1 is ready to test. — more soon.
Try it and share what you find — feedback thread here.
