Skip to content
Bring your agent with your own subscription.

Where you and your agents design and code on the same canvas.

Wonder brings your team, agents and live product together on one canvas to explore ideas and ship changes without losing the details in translation.

Sign inRequest a demo
search

Used by designers & engineers at:

  • Autentic
  • Deeploi
  • Arc
  • Monaco
  • Browserbase
  • Notion
  • CodeRabbit
  • Tenderly
  • Steel
Opus 5.5 selected with Claude Code

Bring the agent subscriptions you already have.

Your subscription, skills, and plugins. No extra credit costs.

From live product to editable design. And back.

  • Connect your GitHub repository. Start with your existing code, components and styles.

  • Spin up an interactive live preview of your product on the canvas.

  • Bring a page, component or any part of your live app onto the canvas as editable layers. Explore directions with your agents and shape details by hand.

  • When you’re ready, ask your agent to apply your changes back to the code.

Start with a design. Make it something you can try.

Finally a place for all your prototypes. Turn static designs into interactive prototypes you can feel.

Share with your team. Publish the preview and share your prototypes with your team or stakeholders.

What we already shipped and what is on the roadmap

Explore the roadmap

Wonder
Changelog

All releases

Frequently asked
questions.

Something else on your mind? Talk to the team.

What is Wonder?

Wonder is a canvas where you design with AI on your real product. Bring in existing designs from Figma or code, explore variations, and refine every detail. What you design is code, so what you see is what gets shipped.

Which coding agents does Wonder work with?

Wonder connects to your agent over MCP. Cursor, Claude Code, Claude Desktop, Codex, Antigravity, and Lovable have step-by-step setup guides, and any other MCP client can connect too. Set up your agent →

Do I pay extra for AI credits?

No. Your agent runs on the subscription you already have, so there is no additional credit-based pricing on top. The Wonder MCP server is free on every plan, including the free tier.

Does Wonder work with my existing codebase?

Yes. Connect a GitHub repository and Wonder reads your real components, tokens, icons, and views and brings them onto the canvas. When you are ready, Wonder can open a pull request on a new branch, only after you approve the plan.

Is my codebase stored on Wonder’s servers?

No. Your repository is cloned to your own machine, and your agent reads and edits the code there. Wonder never stores any of your code on its servers.

Can I bring in my Figma designs?

Yes. Copy any selection in Figma and paste it onto the Wonder canvas, where it becomes editable layers.

Which platforms does Wonder run on?

Wonder runs in the browser, and there is a desktop app for macOS (Apple Silicon and Intel) and Windows. Download Wonder →