GitHub figstudio

figstudio wants a .fig file.

Figma's own MCP server wants a paid seat. figstudio opens Figma local copies on your machine and hands the exact frame to Claude Code, Cursor or Codex. Free and open source.

Open figstudio Source on GitHub 
> Build the wrap grid from frame 1:2

● figstudio · reveal_node(nodeId: "1:2")
  └ revealed 1:2 in tab 1
● figstudio · get_screenshot(nodeId: "1:2", scale: 2)
  └ 560x390 px, scale 2
● figstudio · get_design_context(nodeId: "1:2")
  └ <div data-node-id="1:2" data-name="Horizontal wrap top left"
      className="w-[280px] h-[195px] flex relative flex-wrap
      content-start gap-[4px] p-[20px] items-start overflow-clip">
      <div data-node-id="1:5" className="shrink-0 w-[40px] h-[40px] bg-[#F2994A]" />
      …

Ask for a frame by id.

Asked

● figstudio · get_screenshot(nodeId: "1:2", scale: 2)
  └ waiting for the open tab…

Pick and run

● figstudio · get_screenshot(nodeId: "1:2", scale: 2)
Frames in stacks_wrap.fig
Runs on the real output figstudio returned for this frame.

Returned

● figstudio · get_screenshot(nodeId: "1:2", scale: 2)
  └ 560x390 px, scale 2
Frame 1:2, Horizontal wrap top left, as figstudio rendered it
Horizontal wrap top left

See it work, in 48 seconds.

Recorded in figstudio with the public test files from its repository. Sound is in the player.

From Figma to your agent

To begin, save a local copy. In Figma, choose File, then Save local copy. You get a .fig file on your disk, and figstudio reads it as it is: no Figma account and no network.

Figma › File › Save local copy… stacks_wrap.fig

Then, open it. Drop the file on figstudio in your browser, or open it in the desktop app. The file stays in that tab or window. Nothing is uploaded, and files larger than 256 MB load their images only when they are drawn.

figstudio showing every frame of stacks_wrap.fig with the document overview panel figstudio with the frame Horizontal wrap top left selected and its layout properties shown figstudio zoomed into the selected frame

Next, point your agent at it. Install the MCP server and add it to your agent. When the agent first needs a file it opens figstudio in your browser and pairs with that tab. If the browser asks to let the page reach devices on your network, allow it: that is the server on 127.0.0.1.

cargo install --locked --git https://github.com/pelvo/figstudio figstudio-mcp
claude mcp add figstudio -- figstudio-mcp --origin https://figstudio.pelvo.dev

From then on, it works by node id. The agent lists the pages and frames, reveals a node in your open tab, renders it to PNG and reads it back as React and Tailwind, instead of guessing from coordinates. This is what it got for the frame you picked above.

And if you prefer an app, the desktop app runs the same server inside itself. Turn on Agent access in Settings and connect to the address it shows.

figstudio Settings, Agents tab, with Agent access and the MCP address 127.0.0.1:3845/mcp

Figma's tool names

The same names as Figma's server

figstudio's own

In the browser, three more

Written in Rust. Fast on big files.

0.7
seconds to open a 1.7 GB file in the desktop app
1.4
seconds to open the same file in the browser
16
MCP tools, three more in the browser
3845
the local port, as with Figma's own server
0
bytes of your file uploaded

Add figstudio to

Copies the install line (it needs Rust's cargo) and the setup for that agent.

cargo install --locked --git https://github.com/pelvo/figstudio figstudio-mcp
claude mcp add figstudio -- figstudio-mcp --origin https://figstudio.pelvo.dev