SVG Lab

5 August 2026 · Usman Bashir

Building an SVG Editor as a Non-Designer

A browser SVG editor got built instead of getting better at prompting AI for graphics: this is a story about vocabulary, not talent.

I'm not a designer. I can picture a design clearly enough in my head, but getting an AI assistant like Claude or Codex to actually produce the SVG I was picturing was a grind: vague prompts, wrong outputs, round after round of "no, not like that" iterations that never quite closed the gap between what I imagined and what came back.

Every time that happened, I was facing the same choice: keep spending days trying to prompt a design into existence, or spend an afternoon building a small tool that let me just do it myself, in minutes, exactly as imagined. I kept choosing the tool. That's how SVG Lab happened: a free browser SVG editor, no install, that lets me draw whatever I'm picturing, place it anywhere, and drop it straight into whatever device-screen UI I'm building. That specific task, getting a design out of my head and into a real interface, had been genuinely hard to do through AI assistants alone, for someone without a design background.

Then the SVGs needed to move

Once I had static SVGs I was happy with, the next problem showed up immediately: they needed animation, and there was no tool that let me just try different animations on my own artwork to see what actually fit. I'd load an SVG somewhere and either get a fixed preset that didn't match, or a code-first animation tool that assumed I already knew what I was building toward.

The real block wasn't motion design skill: it was vocabulary. I didn't know what the animations I was imagining were actually called. Was it a "stroke draw-in"? A "path morph"? I genuinely didn't know the term, which meant I couldn't even write a prompt for it. You can't ask an AI for something you can't name.

So I built a small animator instead: load an SVG, click through a set of preset animations, watch each one play on your own artwork, and pick by eye. Discovery instead of vocabulary: you don't need the term if you can just look at it happening on the thing you actually made.

The part that stung the most

The clearest version of this whole pattern showed up when I made the launch video for SVG Lab, a 25-second clip, mostly animated SVGs, built with HyperFrames through Codex. It took days. Same root cause as everything above: I didn't know which animations existed or what to call the motion I had in my head, so I couldn't direct the AI toward it.

Eventually I gave up on getting my own vision out. I found someone else's launch video on X, showed it to Codex, and said "make something like this." What came back was fine. It worked. But it wasn't the video in my head, it was someone else's video, wearing my product's name.

That one stuck with me more than the others, because it wasn't a drawing or an animation preset: it was the actual launch, the thing meant to represent the whole project, and I ended up shipping a compromise on it. The lesson I keep coming back to: people shouldn't have to give up on their own vision for something as important as how they introduce what they built. The marketing video is one of the last steps after the actual product is done, and it's exactly the kind of step where "just describe it to the AI" quietly stops working if you don't have the vocabulary, and most builders don't.

Where this is going

SVG Lab and the animator aren't meant to stay small utilities to me. The direction I want to take this is a platform that handles the whole design process, end to end, for people who can build software but can't design it: the same "thousands of new developers and vibe coders like me" I'd guess make up a lot of anyone reading this. App builders should be able to grab the animated SVG or its code directly for their project, with no separate video step in the way. Founders and marketers should be able to compose animated SVGs into scenes and render an actual launch video from inside the same tool, instead of hitting the wall I hit.

That's still a direction, not a finished thing. Some of this is genuinely built today, some of it is still ahead. But the throughline hasn't changed since the first version: I can't always name what I want, and I shouldn't have to, to get it made.

If any of this sounds familiar (you can build the thing but the design step keeps costing you days you don't have), SVG Lab is free to try. Prefer to start with one task instead of the whole editor? The SVG to PNG converter and the other single-purpose tools sit outside the app too, for exactly that.

Open the SVG editor Back to the blog