kr.Keith’s Playbooks
← The library
Design / playbook

Generate a logo you can actually edit.

Most AI images arrive flat and final. Generate editable SVG instead, so you can change one colour or one path without starting over.

PNG VERSUS SVG · ILLUSTRATIVE

One is a picture. The other is still a document.

The difference shows up the moment someone asks for a change

THE STARTING POINT

A generated PNG logo. The client wants the blue deeper. There is no blue to edit — only pixels that happen to be blue, so you re-roll the prompt or trace it by hand.

A MORE USEFUL RESULT

A generated SVG logo. You select the one shape, change its fill, and everything else stays exactly as approved.

Scaling
Pixels soften as they enlarge; paths redraw cleanly at favicon size and at billboard size.
Editing
A raster image is one flat surface; a vector file is separate shapes you can select individually.
Revision
"Make the blue deeper" means regenerating, or changing one fill.
Handover
A binary image versus plain text that diffs in version control.
An illustrative comparison of the two formats, not a sample of any particular tool’s output. Vectors suit flat, geometric artwork; photographic images are still better as raster.

Two logos can look identical on screen and behave completely differently. Enlarge a PNG and it softens, because it is a grid of pixels. An SVG is a set of instructions for drawing shapes, so it redraws at any size — and you can open it up and change the parts.

YOU’LL WALK AWAY WITH

A vector asset with named, editable paths, plus a prompt that asks for clean geometry instead of a pretty dead end.

A vector-native AI model · any SVG editor · optionally a code editor or API

01 / The difference is editability, not sharpness

Scaling is the demo everyone shows, but it is the smaller half of the story. A PNG stores a grid of pixels, so enlarging it invents detail that was never captured and the edges go soft. An SVG stores the shapes themselves — paths, curves, fills — so the same file redraws crisply on a favicon or a billboard.

The half that changes your work is what happens after. An SVG is not one flat image. It is a document of separate shapes you can select individually: recolour a single element, nudge one curve, rename a layer, or delete the part you never wanted. A raster image gives you one surface and no seams.

  • PNG: a grid of pixels. Fixed resolution, no separable parts.
  • SVG: drawing instructions. Any size, and every shape is addressable.
  • SVG is usually smaller for flat graphics, and it is plain text, so it diffs in version control.

02 / Why "close enough" costs you an afternoon

This is the real complaint about generating images for brand work. The output looks finished, and then the client asks for the blue to be a little deeper, or the mark to sit slightly wider. With a raster image there is no blue to change — only pixels that happen to be blue.

So you re-roll the prompt and get a different logo, or you trace it by hand in a vector editor and wonder what the generator saved you. Neither is iteration. The asset was final the moment it was created, which is precisely the wrong property for a logo, an icon, or anything that has to survive feedback.

03 / Match the format to the job

Vectors are not automatically the right answer. They suit flat, geometric, bounded artwork: logos, icons, diagrams, line illustrations, UI marks. That is where crisp edges and separable shapes pay off.

They are a poor fit for photographic texture, soft gradients, and painterly detail. Vectorising a photograph tends to produce either a mush of shapes or a file so complex it is slower to edit than to redraw. If the output is a photo-real hero image, a good raster generator is the right tool and this workflow is not.

  • Good fit: logos, icons, diagrams, line art, anything needing crisp edges at any size.
  • Poor fit: photographs, soft gradients, painterly texture.
  • Ask yourself whether anyone will need to edit one part later. If yes, generate vectors.
READY TO MAKE IT YOURS?

Get the exact prompt.
Make it your own.

You’ve seen how it works. Unlock the copyable prompt and the remaining steps to try it yourself.

  • Generate the vector, then copy the prompt
  • Check it like a file, not like a picture
Already a member? Use your existing account. Every playbook is free.