The Human Algorithm/Claude Cannot Draw. Ask It for an SVG Instead.

The Human Algorithm • Thursday

Claude Cannot Draw. Ask It for an SVG Instead.

Claude Code has no image generator in it at all. It can still hand you a logo that never goes blurry, because an SVG is not a picture. It is a list of instructions, and writing is the thing these tools are good at.

Most people have had the same disappointing afternoon with an AI image generator. You ask for a logo, you get something that is almost right, and when you look closely the text is gibberish and the edges are mush. Then you try to make it bigger and it falls apart.

So here is a thing almost nobody mentions. Claude Code cannot generate a single image. No image model, no picture, nothing. Neither can the chat window in the way you are thinking of.

And yet it can hand you a logo that is sharper than anything a generator will give you, at any size, forever.

What an SVG actually is

A normal picture is a grid of coloured dots. A photograph of a pumpkin is maybe two thousand dots across and fifteen hundred down, and each one has a colour written down. That is all a JPEG or a PNG is: a very long list of dots.

The problem with a list of dots is that there are only so many of them. Make the picture twice as big and the computer has to invent the dots in between, and inventing dots is what blurry means.

An SVG is not a list of dots. It is a list of instructions.

Open one in a text editor and you can read it:

<circle cx="100" cy="100" r="60" fill="orange" />

A circle, a hundred across and a hundred down from the corner, sixty wide, orange. That is not a picture of a circle. It is a sentence describing one, and your computer draws it fresh every time you open the file.

Which is why it never goes blurry. Ask for it at the size of a postage stamp and it works out the maths for a postage stamp. Ask for it on the side of a building and it does the maths again. There are no dots to run out of.

The arithmetic, because it makes the point better than I can

A carved jack-o-lantern drawn as a vector
This is a picture of the pumpkin. The pumpkin itself is 3,238 bytes of text, and the candle inside it flickers because three of those lines say so.

I made the pumpkin below as an SVG, then saved the same pumpkin as a PNG at two sizes. These are the real file sizes:

File size
PNG, 200 pixels across 19,310 bytes
PNG, 1024 pixels across 163,214 bytes
SVG, any size at all 3,238 bytes

The PNG grows more than eight times over when you ask for a bigger one, because a bigger grid needs more dots written down. The SVG does not move. It is 3,238 bytes whether you open it on a watch or project it onto a wall, because the instructions for a circle are the same length however big the circle is.

Six times smaller at thumbnail size. Fifty times smaller at a size you would actually put on a website.

Why this means your AI can make one

Here is the part that matters. An SVG is text. And writing text is the one thing these tools are unambiguously good at.

So when you ask an image generator for a logo, you are asking it to paint. When you ask Claude or ChatGPT for an SVG, you are asking it to write, and it is writing in a language a browser already understands.

That is the whole trick. You have been asking the wrong tool for the wrong thing.

Let us make something, since it is Halloween

Open any of them. Claude, ChatGPT, Gemini. Paste this:

Write me an SVG of a jack-o’-lantern. 200 by 200 viewBox. Orange body, green stalk, two triangle eyes and a grin cut out of it so the background shows through. No external files, no fonts, just shapes. Give me the raw SVG code in a code block and nothing else.

Copy what comes back into a file called pumpkin.svg and double click it. It opens in your browser, because every browser already reads this.

Now the bit that is genuinely fun. Go back and say:

Now make the candle inside it flicker, using only SVG animation. No JavaScript.

It will edit the same file and add a few lines. Open it again and the thing glows and dims on its own. No video, no GIF, no editor. A text file that moves.

Three more worth trying tonight

A ghost whose tail wobbles. A bat that flaps by rotating two wing shapes around a point. A spider that drops on a thread when the page loads, which is one line of animation on a vertical position.

None of these are hard for the model. They are hard to *ask for* if you do not know the word SVG, which is the only reason most people never get them.

What it is like to actually work with one

The thing that surprises people is that you can argue with it.

A generated image is finished the moment it arrives. If the mouth is wrong, you ask again and you get a different picture, and now the eyes are wrong too. There is nothing to point at.

An SVG is a list you can read. If the mouth is wrong, the mouth is one line in that list, and you can say “the grin is too low, move it up fifteen” and nothing else in the file changes. That is a different relationship with the tool. You are editing, not re-rolling.

It also means the file is still useful in a year. Ask for the same pumpkin in your brand colours and it changes one word. Ask for a version with no face for a background and it deletes three lines. Try that with a picture.

Where it stops

It will not give you a photograph, and it should not try. Anything with texture, shadow, skin or weather is the wrong job for this.

It is also not reliable at complicated drawings in one go. Ask for a detailed castle and you get a sad lump. The way through is to build it in parts: ask for the outline, get that right, then ask it to add one thing at a time. You can see the code, so you can always point at the line that is wrong.

And a model will occasionally hand you something that is not quite valid. Your browser will simply refuse to draw it, which is an easy failure to spot and an easy one to fix: paste the error back and say “this did not render.”

What to do with it

The honest use is not art. It is the small stuff that normally costs money or an afternoon: an icon, a logo mark, a divider, a chart you actually control, a simple animated character for a side project.

Those files are tiny, often ten to fifty times smaller than the equivalent GIF, and because they are text your AI can edit them later. Ask for the same pumpkin in blue, and it changes one word.

Forward → Upward ↑ Onward &nearr;

Mstimaj

Sources and Further Reading

– The starter prompts above were run before publishing, and the four files they produced (pumpkin, flickering pumpkin, ghost, bat) were opened in a browser and confirmed to render with no errors – File sizes measured on those exact files, not estimated – SVG is a W3C standard, supported by every current browser – Earlier piece on this site: *I Turned a Static Logo Into an Animated SVG Character With AI*

Comments

No comments yet. Yours can be the first.

Comments are read before they appear.

No schedule, no filler

Get the next entry