Key features

• Design with real code — Everything on the canvas is actual HTML, CSS, and React. No translation layer, no export step.
• Powered by Claude Code — AI assists you directly on the canvas, generating and editing code as you design.
• Zero handoff — What you see is what ships. Designers and developers work in the same source of truth.
• Round-trip editing — Edit in the canvas or in code. Changes sync both ways.

Get started

Quickstart
\
Download Lunagraph and start designing with code.

Install Claude Code
\
Set up Claude Code so you can use AI chat in Lunagraph.

Chrome Extension
\
Copy UI from any website and paste it into Lunagraph.