How I Use Claude Code to Create Real Graphics Without an AI Image Model

The Core Idea: Let Claude Write the Renderer

Most people think of AI image generation as a direct process: type a prompt, send that prompt to an image model and receive a JPG or PNG.

Claude Code gives us another option.

Rather than asking a model to predict the pixels of an image, we can ask Claude to generate ordinary programming instructions that create those pixels.

Imagine asking for a promotional Instagram graphic. Claude can decide that the design should use a dark gradient, a large white headline, an accent shape in the corner and a small call-to-action underneath.

Then it can express those decisions in code.

from PIL import Image, ImageDraw, ImageFont

canvas = Image.new("RGB", (1080, 1080), "#111827")
draw = ImageDraw.Draw(canvas)

draw.rounded_rectangle(
    (90, 90, 990, 990),
    radius=45,
    fill="#312e81"
)

draw.text(
    (140, 360),
    "BUILD WITH AI",
    fill="white"
)

canvas.save("social-graphic.png")

That example is intentionally basic, but Claude can generate much more elaborate scripts containing gradients, multiple typefaces, geometric elements, texture, glow, shadows and layered compositions.

Why Generate Graphics With Code?

AI image models are powerful, but a generated illustration and a designed graphic are not always the same problem.

A cinematic landscape requires an image model to invent enormous amounts of visual detail. A quote card, YouTube title card, chart cover or product announcement has a different priority: layout, text, spacing, colors and consistency.

1. Your text is actual text

When Python draws a headline using a real font file, the renderer is typesetting characters. It isn’t trying to visually imitate the appearance of letters.

That distinction becomes valuable when your image includes a long title, price, URL, call-to-action, quotation or numbered list.

2. Small changes can stay small

Suppose you have a completed design and decide the main title needs to move 30 pixels higher.

With a code-based graphic, Claude can modify that coordinate and render the same composition again.

You aren’t forced to create an entirely new interpretation of the scene just because one element changed.

3. Templates become reusable systems

Once you have a script for a 10-slide carousel, you can replace the copy without redesigning every slide.

This makes the approach interesting for bloggers, social media marketers, YouTube creators and businesses that publish recurring content.

4. Local rendering can remove image API costs

Libraries such as Pillow operate directly on your computer. For the actual pixel rendering step, you don’t need to send every graphic to a separate hosted image-generation service.

5. Designs can be deterministic

If the script, inputs and rendering environment stay the same, you can reproduce the same designed graphic instead of hoping a generative model interprets the prompt the same way twice.

Level 1: Build 2D Graphics With Claude Code + Python

The easiest place to start is 2D design.

The public Claude image-generation toolkit includes a code-based design workflow built around Python drawing tools. Claude receives your request, interprets it as a design brief, and creates the instructions needed to render the final composition.

You might type something as simple as:

Create a vertical Instagram quote graphic.

Quote:
"Great businesses are built one useful
decision at a time."

Style:
Modern editorial
Dark navy background
Large typography
Purple accent
Minimal decoration

Size: 1080 x 1920

The interesting part is that you do not need to manually calculate every coordinate yourself. Claude can make those design decisions and convert them into a script.

These example blocks are made directly with CSS for this article, but they demonstrate the kind of graphics that translate especially well to programmable design: gradients, geometric compositions, social covers, typographic posters and repeatable brand graphics.

How the 2D Claude Code Workflow Works

You can think of Claude as occupying the role between your idea and the rendering engine.

Level 2: Create 3D Graphics With Three.js

Flat graphics are only the beginning.

A second approach uses Claude Code to construct an actual 3D scene. Instead of drawing a circle or text directly onto a flat canvas, Claude can create objects, materials, cameras and lights with Three.js.

The scene is then rendered and captured as a still image.

const scene = new THREE.Scene();

const camera = new THREE.PerspectiveCamera(
    45,
    width / height,
    0.1,
    100
);

const light = new THREE.DirectionalLight(
    0xffffff,
    3
);

scene.add(light);

// Claude builds product geometry,
// assigns materials,
// positions the camera,
// then renders the finished frame.

This makes it possible to create stylized product renders, low-poly environments, abstract scenes and other imagery that needs actual depth.

Examples of where 3D code rendering makes sense

• Floating headphones on a clean studio background.
• A stylized rocket launch scene.
• Simple low-poly landscapes.
• Glowing crystals or abstract objects.
• 3D website hero graphics.
• Product mockups.
• Thumbnail backgrounds.

The advantage here is not that a coded 3D object can imitate every photograph. It can’t. The advantage is precision. If you want the camera at the same angle tomorrow, the script can put it in the same place.

When Should You Use Code Instead of an AI Image Model?

Code isn’t automatically better than generative imaging. They solve different types of visual problems.

Here is the decision framework I would use.

You can also combine both approaches. Generate an illustration with an image model, then programmatically add your headline, logo, gradient overlays, badges and CTA text afterward.

For marketing graphics, that hybrid workflow may be even more useful than choosing only one technology.

How to Get the Claude Code Image Skills

You don’t have to build the entire rendering workflow from scratch. The open-source project used as the technical reference for this approach is available publicly on GitHub.

Start by cloning the repository:

git clone https://github.com/hassancs91/claude-image-generation.git

cd claude-image-generation

For the Python graphics workflow

Make sure Python is installed, then install the core packages needed for the 2D renderer.

pip install pillow numpy

Open the project in Claude Code

The project includes Claude skill folders that contain instructions explaining how the generation workflow should operate.

From there, the interaction becomes conversational.

Create a modern 16:9 blog featured image.

Headline:
CLAUDE CODE GRAPHICS

Subtitle:
Generate Images Without an AI Image Model

Background:
dark navy with purple mesh gradient

Style:
minimal technology editorial design

Keep the typography large and readable.

What Can You Build With This?

Once you stop thinking of the output as a single image and start thinking of it as a programmable design system, many practical uses appear.

Blog featured images

Create a template containing your site colors, logo position, category badge and typography. Give Claude a new article title and let it generate a corresponding graphic.

YouTube thumbnail templates

Use fixed positions for the headline, border, arrow, icon and background effects. You can then replace only the elements that change between videos.

Instagram quote cards

Feed Claude a collection of quotations and use one design system to render every card at the correct dimensions.

Carousel posts

Create an opening slide, information slide, numbered slide and CTA slide. Claude can reuse those components while changing the content across the carousel.

Product feature graphics

Build a repeatable composition where the product occupies one side and the feature title occupies the other.

Data-driven graphics

Because the design is code, content can potentially come from a database, CSV file or API before the image is rendered.

That opens the door to automatically generated reports, stat cards, ranking graphics, price cards and other visual content.

Multiple aspect ratios

Instead of manually recreating one graphic for every social network, the rendering script can use different canvas sizes and rearrange the elements accordingly.

What If You Actually Need AI-Generated Images?

Code rendering is excellent for designed graphics, but sometimes you really do want an AI image model.

Maybe you need a realistic landscape, a cinematic background, conceptual artwork or another scene that would be difficult to construct from shapes and 3D geometry.

In that situation you can use Claude Code as the controller for an actual image-generation model instead.

Frequently Asked Questions

The Bigger Idea: Turn Claude Into a Repeatable Creative Worker

The most interesting part of this experiment isn’t the fact that Python can create an image. Developers have been creating graphics programmatically for decades.

What changes the experience is the conversational layer.

You no longer have to personally write every drawing instruction. You describe the goal and Claude can translate the creative direction into executable logic.

More importantly, once you discover a process that works, you can save that process.

Your color rules, dimensions, spacing decisions, font hierarchy, file naming, quality checks and export formats can become part of a repeatable workflow.

That makes Claude Code more than a code-completion assistant. It can become the orchestration layer behind small production systems.

And graphics are a particularly easy place to see that idea in action because the result is immediately visible.

Related Guides