The design canvas you know, but it writes real code, powered by Claude Code.

Lunagraph lets you design and create UI using real HTML, CSS and React code. Stay consistent with zero handoff and work between teams, designers, product, developers, and agents.

Sculptors don't hand off a sketch and hope someone else carves it right. They shape the stone themselves.

Software should work the same way.

The ones who agonize over every pixel should be shipping the final code for the design.

Finally, design is code.

The deliverable isn't a design file. It's the code itself. No more translating pixels into tickets. What you craft is what ships.

export function NewComponent() {
    return (
        <div className="flex flex-col gap-4 w-fit p-6 bg-background">
            <h2 className="font-serif tracking-tight font-medium text-3xl text-foreground leading-tight">
                Finally, design is code.
            </h2>
            <p className="max-w-2xl leading-relaxed text-lg text-muted-foreground">
                The deliverable isn't a design file. It's the code itself.
                No more translating pixels into tickets.
            </p>
        </div>
    )
}

Work together with Claude Code, a creative design partner that carries the full picture.

Your documents, the canvas, your moodboard and inspiration, down to the codebase itself. Every decision informed by everything you've already built.

Finally, design is code.

The deliverable isn't a design file. It's the code itself. No more translating pixels into tickets. What you craft is what ships.

Color Palette System

  • Warm Whites
    • Ivory #FAF8F5
    • Linen #F5F0EB
    • Sand #EDE8E1
    • Oat #E6DFD5
  • Accents
    • Butter #F9F0E2
    • Rose #F5E1E8
    • Mint #E8F0ED
    • Thistle #EDE5F0

The full design-to-codebase round trip, in one platform.

The chat sees your canvas and your local codebase. Design on the canvas, implement straight into your repo, preview the result in a live iframe — then screenshot both to compare. No context switching, no handoff.

Your familiar design canvas, but it writes code, and AI powered.

Join designers who write real code.

Design and ship in one canvas.