Skip to main content
Figr MCP gives coding agents the real design behind your screens: its code, structure, values, your design system and the reasoning that shaped it. MCP (Model Context Protocol) is an open standard that lets AI tools connect to outside sources. Your agent builds from the actual design instead of guessing from a screenshot.

​
What your agent can do

See what's in a project

List the designs, conversations and files in a project.

Read any design

Open a design to see its code and how it was built.

Use your design system

Read your real components and tokens, and build against them.

Understand the why

Pull the reasoning behind a design from your conversations with Figr.

Search across designs

Find elements, patterns or text across a project.

Create and edit in Figr

Write access lets an agent add and change content in Figr. Changes show in the project chat and version history.
Write access is available to select organizations. Talk to us to turn it on.

​
Connect from a design

The fastest way in. Figr walks you through setup for your agent and gives you a starter prompt.
1

Select the prototype

Click the prototype on the canvas to show its toolbar.
Selected prototype with its toolbar on the canvas
2

Open Export, then Open in coding agent

The Connect with coding agent window opens.
Connect with coding agent window with Claude Code, Cursor, VS Code, Codex and Other
3

Pick your agent

Choose Claude Code, Cursor, VS Code, Codex or Other, and follow the steps shown. For Claude Code, the window gives you two commands to install the Figr plugin. Run both in your terminal.
4

Paste the starter prompt

Copy the starter prompt into your agent. It points the agent at this design, so it starts with the right context.

​
Add Figr MCP to your editor

Register the server once so your agent can reach any project you have access to. The server URL is https://mcp.figr.design/mcp.
Install the Figr plugin from Open in coding agent, or add the server in your terminal:
The first time your agent connects, you sign in to Figr and approve access.

​
Access scopes

Your agent can only reach what your Figr account can reach.

​
Supported clients

Claude Code, Cursor, VS Code and Codex have guided setup in the Connect with coding agent window. Google Antigravity and any other agent that supports HTTP (Streamable HTTP) MCP servers can connect with the manual config above.

​
Best practices

  • Start from Open in coding agent on the design you’re building. The starter prompt keeps the agent focused on that screen.
  • Attach your design system in Figr before handing off, so the agent builds with your real components.
  • Review the access you’re approving before you sign in from a new agent.

​
Troubleshooting

Export options

Other ways to hand off a design.

Copy and download

Get the code directly.