How Figma MCP works, from your request to your file
How Figma MCP works is simple to state. Your agent, Claude Code or Codex, calls tools on a small MCP server on your Mac. A plugin in the Figma desktop app then reads or edits the file you have open and returns the result.
The three parts
| Part | Where it runs | What it does |
|---|---|---|
| Your agent | Claude Code or Codex | Reads your request and decides which tool to call. |
| The MCP server | On your Mac | Offers the tools to the agent and passes each call on. |
| The plugin | Inside the Figma desktop app | Reads and edits the file you have open, then returns the result. |
The server talks to the plugin, and the plugin acts in the file through Figma’s Plugin API. There is no Figma access token to create or paste.
Download for Mac Version 0.1.10
Figma MCP how it works: one request, step by step
You ask
For example: “Rename every layer called Frame 12 to match its heading.”
The agent reads first
It calls
page_infoandnode_infoto find the layers and their exact names.The agent writes
It calls a write tool and passes each current name back. A wrong name is refused.
The plugin checks and acts
The plugin checks scope and names. If they pass, it makes the change in your file.
The agent checks
It can read the layers again, or export a picture with
node_export_visual.
Figma MCP what does it do
| Group | Examples |
|---|---|
| Read | List pages, layers, components, styles and variables. Get a picture of a layer. |
| Create | Frames, shapes, text, SVG layers, components, variants and instances. |
| Change | Rename, move, resize, copy, group and delete layers. Set fills, text, effects and auto layout. |
| Design system | Create and edit variables and styles. Bind variables to layers. |
| Notes and prototypes | Write annotations and prototype interactions. |
For the full list, see all tools. It does not generate code, and it does not import HTML.
Figma MCP how to use it
Install
Download the Mac app and follow its checklist. See Figma MCP setup.
Open a file
Use the Figma desktop app.
Ask
Ask Claude Code or Codex. Name the page or frame, and say what must stay the same.
Review
Look at the result. Use Figma version history to go back.
Why it reads before it writes
The file is a live document. You or a teammate may rename or move a layer between two calls. So the agent reads the current names first, and each write passes them back. If a name no longer matches, the plugin refuses the edit, and the agent reads again. This is how a wrong target gets caught before it changes anything.
What keeps it in bounds
- Edits go only to the open file where the plugin’s AI can edit this file switch is on. With it off, the agent can only read.
- Each edit names its target, and the name must match.
- Bulk edits are checked first. If one item is invalid, nothing changes.
- A wrong edit that follows the rules still goes through, so review.
Your agent sends what it reads to its own model provider, under that provider’s terms. FigmaMCP sends no design content to us. For background, see what is a Figma MCP server and edit Figma with AI.
