code-to-design

Use Claude Design from Claude Code, Codex, Cursor, Gemini CLI, and 70+ coding agents. Create designs from your real codebase, refine them on the canvas, and sync every change back. One installer, no MCP setup.

The missing piece of the AI + Figma loop. Create and edit designs directly on the Figma canvas from Claude, Cursor, VS Code, or any MCP app. One command. No API key. No plugin. Just npx tellfigma.

Bidirectional sync between Pencil.dev designs and frontend code via Claude Code

MCP server that lets an AI agent write real designs onto a Figma canvas

Convert self-contained HTML — including Claude designs — into native, editable Figma layers. Frames or Slides, 100% local.

Live two-way bridge between a running web app and Figma. Push screens as auto-layout frames; Figma edits go back into the code, code edits update Figma. A fork of Figma Console MCP.

Local-first design-canvas agent harness — one MCP contract that renders AI-generated design into MasterGo / Penpot, and reads canvas design back to code.

Turn a live web page into editable Figma layers. Your own headless Chrome, no hosted renderer, no per-import quota.

Claude Code plugin: turn code and live websites into editable Figma designs. Bundles the Figma MCP.

Design system I build, version and publish