Subframe

What is Subframe?

Subframe is an integrated environment combining a design canvas, a coding agent and a built-in browser so designers and developers work inside the real codebase.

Key capabilities of Subframe

• Design canvas: Infinite HTML and React canvas.
• Component system: Props, slots and variants synced to code.
• Coding agent: Claude Code and Codex built in, other agents via MCP.
• Built-in browser: Preview and edit live apps.
• Capture to canvas: Bring elements from running apps onto the canvas.
• Multiplayer: Comments and shareable links.
• Design tokens: Theme management across light and dark modes.

How Subframe works

Designs are built on HTML and React and synced to your codebase. The agent reads code, implements designs, runs git operations and opens pull requests. Code stays local; only the canvas lives in the cloud.

Who uses Subframe?

Product designers and front-end developers, best with React but usable with any web technology.

Subframe pricing

Free is $0 with one project, unlimited viewers and editors, and limited AI credits. Pro is $20 per editor per month with unlimited projects and 6x AI credits. You can use your own Claude or Codex subscriptions.

Subframe alternatives

Musho, Creatie and Readdy are AI design and UI tools. Subframe differs by syncing design to your React codebase with an agent.