figme — read local Figma .fig files from an AI agent

figme is an MCP server that lets an AI agent read everything inside a local .fig / .figma file — document structure, geometry, fills, strokes, effects, auto-layout, text (including mixed-format runs), components and instances, variables, prototype links and embedded bitmaps.

It is fully offline. No Figma account, no access token, no REST API, no network at runtime. It parses the file's own bytes, using the Kiwi schema that Figma ships inside every .fig.

It is also token-aware: the reference file used to develop it holds 116,142 nodes, and no tool response ever exceeds ~20 KB. Everything is shallow by default, filterable, and paginated with cursors.

you: "what does the tab component in design.fig look like?"

fig_overview  → 10 pages, 2,046 components, 273 variables, 212 images
fig_find      → "lv2/tab/large" is 2:1337, on page "Page 1"
fig_style     → display:flex, direction:row, gap:8, padding:"8px 16px",
                cornerRadius:4, stroke #FFFFFF bound to variable "tab/large/underline"
                (active #FFFFFF / inactive #333333)

Non-goals

These are deliberate, permanent limits — not missing features:

• Rendering is best-effort, not pixel-perfect. A .fig contains no rendered pixels of your frames, but it does contain everything needed to draw them again: Figma bakes outlined strokes, combined booleans, per-glyph outlines and per-instance geometry into the file at save time. fig_render uses that to produce a real picture offline — see Rendering for exactly what is exact and what is approximated. It is not a screenshot of Figma and never will be: read the report before trusting fine detail.
• No writing. Nothing is ever written back into a .fig. The only write paths in the whole server are fig_image { savePath } and fig_render { savePath }, which write to a path you name.
• No Figma API and no network. Nothing here talks to figma.com. Library assets published from other files (styles, variables, components) cannot be resolved offline; they come back as their opaque assetRef so you can see that they exist and where they point.
• No vector-network decoding (v1). Vector geometry lives in a separate binary blob format. fig_node reports the blob indices and fig_blob hands you the raw bytes, but this server does not interpret them.
• Not a diffing or version-history tool. A saved .fig is a full snapshot, not a delta.

Requirements

• Node.js ≥ 22.15 (needs zlib.zstdDecompressSync; developed on Node 24).
• Runtime dependencies: @modelcontextprotocol/sdk and zod. The parser itself uses only Node built-ins.

Install

figme is published on npm, so there is nothing to clone and nothing to build — your MCP client downloads it on first start with npx.

You need two things:

• Node.js >= 22.15 (see Requirements above).
• A .fig file on disk. This server reads a local file and never contacts figma.com, so there is no account, token or sign-in — but there is also nothing to read until you save one. In Figma: File -> Save local copy....

The part every client shares

Nearly every MCP client spawns a stdio server from the same two fields:

{ "command": "npx", "args": ["-y", "figme-mcp"] }

On Windows, some clients cannot resolve npx on their own. If the server fails to start, route it through cmd:

{ "command": "cmd", "args": ["/c", "npx", "-y", "figme-mcp"] }

Claude Code

claude mcp add figme -- npx -y figme-mcp           # this project
claude mcp add -s user figme -- npx -y figme-mcp   # every project

Or commit a .mcp.json at the repository root so collaborators get it too:

{
  "mcpServers": {
    "figme": {
      "command": "npx",
      "args": ["-y", "figme-mcp"]
    }
  }
}

The Claude Code extensions for VS Code and JetBrains run Claude Code underneath and share its configuration: register the server once with the command above and the extension sees it. They do not read the editor's own MCP settings.

Cursor

~/.cursor/mcp.json for every project, or .cursor/mcp.json for a single one:

{
  "mcpServers": {
    "figme": {
      "command": "npx",
      "args": ["-y", "figme-mcp"]
    }
  }
}

VS Code — GitHub Copilot agent mode

VS Code uses its own key, servers rather than mcpServers, in .vscode/mcp.json:

{
  "servers": {
    "figme": {
      "type": "stdio",
      "command": "npx",
      "args": ["-y", "figme-mcp"]
    }
  }
}

The same entry works in your user settings.json under "mcp". From a terminal:

code --add-mcp '{"name":"figme","command":"npx","args":["-y","figme-mcp"]}'

Then pick Agent mode in the Chat view.

Windsurf

~/.codeium/windsurf/mcp_config.json:

{
  "mcpServers": {
    "figme": {
      "command": "npx",
      "args": ["-y", "figme-mcp"]
    }
  }
}

Anything else

Spawn npx -y figme-mcp and talk MCP over stdio.

Client UIs and config paths move between releases. The command and args pair above is the stable part; if a path here does not match what you see, check that client's own MCP documentation.

Two things to know before the first call

Use absolute paths. A file argument may be relative, but it resolves against the server's working directory — whichever directory your client happened to launch it from. An absolute path removes the guesswork:

Using figme, run fig_overview on /Users/me/Desktop/design.fig

Watch memory. --max-files N (default 4) caps how many parsed files stay cached. A 39 MB .fig decodes to roughly 900 MB of live objects, so lower it on a small machine and raise it only with memory to spare:

{ "command": "npx", "args": ["-y", "figme-mcp", "--max-files", "1"] }

From a Figma link

The usual job: implement this component from our design, starting from a link someone pasted into a ticket.

1. Save the file locally

This server reads a .fig on your disk and never contacts figma.com, so a link by itself is not enough. Open it in Figma and use File -> Save local copy.... For a Community file, click Open in Figma first — that duplicates it into your drafts, which is what makes the copy possible.

2. Take the node id from the link

https://www.figma.com/design/<file key>/<slug>?node-id=3017-121&t=<share token>
                             ~~~~~~~~~~                ~~~~~~~~
                             which file                which node

Figma writes node ids with a dash in links; the .fig format uses a colon, so node-id=3017-121 is guid 3017:121. You do not have to convert it yourself — every guid argument accepts all of these:

Anything else is passed through untouched, so a typo still fails loudly rather than being guessed at.

The file key is a cloud identifier with no counterpart in the saved file, so nothing can work out which local .fig a link refers to. Always give the path yourself.

3. Ask for the component

Using figme, read /abs/path/UX Case Study Template.fig and implement node 3017:121 as a React component.

A good agent then works roughly in this order:

1. fig_render — see it. The fastest orientation there is; check the approximated and unsupported lists before trusting fine detail.
2. fig_node — size, corner radii, auto-layout, constraints, children.
3. fig_style — resolved fills, strokes, effects and typography, already shaped for code.
4. fig_text — the exact copy, including per-run styling.
5. fig_instance — if the node is an INSTANCE, what it came from and what is overridden. This is what decides reusable component against one-off.
6. fig_variables — token names, so the code references your theme instead of raw hex.
7. fig_render again, and compare it against a screenshot of what you built.

That last step is why the renderer exists: you get a pixel oracle, not just a description.

If the guid does not resolve

Node ids are intrinsic to the document, so the id in the link should be the id in the saved file. If it is reported missing anyway you are most likely in the wrong file — compare fig_overview's document name with the link's slug — or find the layer by name with fig_find, or browse the page with fig_tree.

Do not let an agent fetch the link

A Figma URL is auth-gated and rendered by JavaScript, so fetching it yields nothing useful. Worse, the slug reads like a description, which is enough for a model to invent a plausible component and present it with confidence. The server says as much to every agent at connect time; if yours reaches for the web regardless, tell it not to.

From source

For development, or to run a revision that is not published yet:

git clone https://github.com/ntson9p/figme-mcp.git
cd figme-mcp
npm install
npm run build      # tsc -> dist/
npm test           # builds, then runs the full node:test suite

Register node /abs/path/to/figme-mcp/dist/mcp/server.js in place of npx -y figme-mcp. This repository ships a .mcp.json that already does so for Claude Code.

Tools

Every tool takes file (path to the .fig). Node references are guid strings of the form "sessionID:localID", e.g. "2:1339". Responses that were cut set truncated: true and return an opaque nextCursor you can pass back.