I Made Claude Code Generate Real Graphics With No AI Image Model

Every finished graphic in this guide was made without a diffusion model (the tech behind Midjourney and DALL-E). No API was called. Claude Code wrote a Python script, and the script drew it, shape by shape, letter by letter. That's the whole trick, and it's more useful than it sounds.

I built these skills because I kept hitting the same wall: I'd ask an image model for a poster or a thumbnail, and it would give me beautiful pixels with garbage text on them. So I stopped asking AI to paint words and started asking it to write code that typesets them.

The result surprised me. For a whole category of graphics, the code version isn't a compromise. It's better.

Everything here ships in one public repo, linked at the end of this page. And teaching Claude Code your own playbooks like this is the exact pattern I build real products with in Build With AI 1.0, so consider this guide a working sample of it.

The trick: Claude writes code, the code draws the image

Here's a test. I gave the same brief, a coffee shop logo in a warm palette, to three different systems. One of them is flux-1-schnell, a real AI image model. The other two are pure code.

If you had to look twice to spot the AI one, that's the point. For designed graphics, code holds its own against a diffusion model. And the two code versions bring things the AI one can't: run the script again and you get the exact same image, change one line and only that one thing changes, and the bill is zero forever.

The pipeline behind the two code versions is short:

your idea  →  Claude art-directs (layout, palette, fonts)  →  writes a script  →  the script renders your PNG

A diffusion model is like commissioning a painter: you describe the picture and take whatever comes back. This is closer to a print shop. Claude lays out the file, the printer prints exactly that file, and you keep the file. Keeping the file is what changes editing, consistency, and cost.

Both skills are just folders you drop into .claude/skills/ in any project. Each holds a SKILL.md playbook that teaches Claude how to be a designer, plus the rendering engine the playbook drives. No accounts, no keys.

---

Why I skip the image model for design work

I use diffusion models. I even published a whole guide on generating them for free. But for design work, the kind of graphics a builder actually ships every week, they have four problems that code simply doesn't have.

• Text. Diffusion models paint letter-shaped strokes, they don't typeset. In my Cloudflare guide, flux tried to write on a neon sign and produced "Rattiy". A short single word sometimes survives, like the "Coffee" above. A quote, a headline, a slide with three lines of copy? Never. Code renders real fonts, so the text is perfect at any length, every time.
• You can't edit, only retry. Ask a model to "move the title a bit left" and you don't get your image with the title moved. You get a new image. New cup, new steam, new everything. With code, that request is a one-line edit and the other 2 million pixels don't move.
• Keys, credits, and caps. Every hosted model wants an account, an API key, and a meter. These two skills run on your machine with Pillow and Three.js. There is no meter.
• Artifacts. Six fingers, melted edges, gibberish signage. Code cannot hallucinate. It does exactly what it says, which for brand assets is precisely what you want.

None of this makes diffusion useless. It makes it the wrong tool for posters, quote cards, carousels, and thumbnails, which is most of what I actually need images for. I put the full decision rule in a table below.

---

Level 1: the code design engine

The first skill is called prompt-to-design. It's a small design engine built on Pillow and numpy (fonts included, nothing to install beyond pip install pillow numpy), plus a playbook that turns Claude into an art director. You ask for a graphic the way you'd ask a designer:

make me a quote card for instagram stories:
"Build quietly. Let the work make the noise." by @learnwithhasan

Claude reads the playbook and works through the same steps a designer would. It routes your prompt to a style (typographic, geometric, gradient, soft-minimal, or a poster scene), picks a 3-to-6 color palette, plans one focal element and where the negative space lives, assigns fonts by role, and then writes a short Python script against the engine:

d = Design("9:16")
d.mesh_gradient([...])                  # deep purple-to-coral field
d.write(0.09, 0.28, "Build", role="display", weight="bold", size=210, ...)
d.write(0.09, 0.40, "quietly.", role="serif_book", italic=True, ...)
d.save("quote_card.png", grain=6)

Here's real output, straight from the repo. Four different prompts, four different styles, all drawn by scripts Claude wrote:

Notice what every one of these has in common: the words are crisp. That quote card is the exact use case where diffusion models fall apart, and here it's the easiest thing on the page, because "Build quietly." is a string passed to a font renderer, not a texture generated by a model.

My favorite part is the last step of the playbook: the skill is required to check its own work before showing you anything. It samples the pixels behind the text to confirm contrast, verifies each element actually landed where it should, and re-renders if something is off. You only ever see a checked image.

---

Level 2: the 3D renderer

The second skill, 3d-image-renderer, goes further. Instead of drawing a flat design, Claude builds an actual 3D scene in Three.js, the same library behind most 3D you see in a browser, then renders one frame of it headlessly. No browser window ever opens. Think of every image as frame 0 of an animation that never plays.

const { renderer, W, H } = createRenderer('16:9', { exposure: 1.15 });
const scene = new THREE.Scene();
// sunset sky, launch tower, rocket, instanced low-poly smoke puffs
await captureFrame({ renderer, scene, camera, outPath: 'out.png' });

That gets you real lighting, real shadows, real depth, still with zero AI models involved:

Two details in this skill tell you it was built by someone who got burned first:

• Everything is deterministic. All randomness runs through a seeded generator and the captured frame is a fixed time. Render the rocket scene tomorrow, get pixel-identical smoke.
• It validates its own frame. After rendering, the skill writes a spec of every object you named ("flowers", "tree canopy") and a validator confirms each one is actually visible in the pixels, at the expected color, at a minimum size. If your flowers didn't make it into frame, Claude finds out before you do, and fixes the scene.

Level 2 has a heavier footprint than Level 1. It needs Node.js and a headless WebGL stack, which the skill installs for you with one setup script, and it renders at three fixed ratios (1:1, 16:9, 9:16). If you just want quote cards and thumbnails, start with Level 1 and come back when you need depth.

---

When to use code vs. a diffusion model

This is the rule I actually use. It's not "code good, AI bad". It's about which tool owns which job:

When the right answer is diffusion, you still don't need to pay for it. I run flux-1-schnell on Cloudflare's free tier, about 170 images a day at no cost, driven by the same kind of Claude Code skill. That's the sibling guide: How to Generate Unlimited AI Images for Free With Claude Code + Cloudflare. Between that guide and this one, you've got both halves covered for $0.

---

Get both skills (free)

Everything on this page comes from my claude-image-generation toolkit, one public repo. Cloning it gets you all of it, not just these two skills:

• The prompt-to-design skill (Level 1): the full design engine, bundled fonts, playbook, and the reference scripts behind the four examples above
• The 3d-image-renderer skill (Level 2): the Three.js pipeline, style presets, geometry recipes, and the self-validation harness
• The cf-image skill: free flux images via Cloudflare Workers AI, from the sibling guide
• The full story pipeline: skills that split a story into scenes, illustrate them with consistent characters, narrate them with AI voices, and package it all into an interactive player

The advanced payoff of this toolkit is the story pipeline: keeping the same character consistent across a whole illustrated, narrated story. That guide is live now: Consistent AI Characters: Build a Full Narrated Story in Claude Code.

---

FAQ

---

What this is part of

Strip away the pictures and this guide taught one move: encode your standards into a skill, and Claude Code executes them on demand, forever. Here the standard was "good design". In a real product it's your architecture, your API patterns, your deploy checklist, applied the same way.

That's what I cover in Build With AI 1.0. The full course is 38 lessons that walk through:

• Building a full AI SaaS with Python and Django, from empty folder to deployed product
• Directing AI tools with skills, playbooks, and engineering thinking instead of copy-paste-and-pray
• Wiring LLMs and AI APIs into real features at product scale
• Auth, payments, and shipping to real users

---

• Updated July 2026
• Engines Pillow + Three.js
• AI image models Zero
• Cost $0
• Difficulty Beginner

---

Related

• 📚 Solo Builder Hub: every build-with-AI tutorial on the site
• 🖼️ Free AI Images With Claude Code + Cloudflare: when you do want real AI photos, here's the $0 way
• 🚀 Claude Traffic: get free traffic to your website with AI, another Claude-powered system
• 📖 Consistent AI Characters: the advanced payoff, one character kept the same across a whole narrated story

---

Now go draw something.