Figsnap MCP

Connects an open Figma file to an MCP client for extraction, controlled edits, and saved component sets.

Install Figsnap MCP

Pick your client, then add it in one click or paste the config.

STDIONode.js

~/Library/Application Support/Claude/claude_desktop_config.json

claude_desktop_config.json

{
  "mcpServers": {
    "figsnap-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "figsnap-mcp"
      ],
      "env": {
        "FIGSNAP_MCP_TOKEN": "YOUR_VALUE_HERE",
        "FIGSNAP_MCP_URL": "YOUR_VALUE_HERE"
      }
    }
  }
}

Settings → Developer → Edit Config, merge this into mcpServers, then fully quit and reopen Claude Desktop.

Values are written into the snippet above so you can paste it as is. They never leave your browser.

Automated check passed— started and listed 41 tools correctly (2d ago).

Overview

figma
design-tools
developer-tools
mcp

The figsnap-mcp MCP server exposes an open Figma file through MCP tools for reading designs, extracting nodes, making permitted edits, and maintaining saved component sets. It uses a Figma plugin, a local daemon on port 3058, and a stateless stdio MCP process; communication stays on loopback and requires no account or relay. Reach for it when an agent needs access to the currently open Figma canvas rather than a remote Figma API.

Use cases

Inspect the currently open Figma canvas from an MCP client
Extract selected Figma nodes as PNG, React, HTML, or CSS
Enable an agent to make controlled edits in Figma
Maintain a saved set of reusable components

Key features

Figma plugin bridge
41 MCP tools
PNG, React, HTML, and CSS extraction
Optional canvas editing
Saved component sets
Loopback daemon with token authentication

How Figsnap MCP works

What figsnap-mcp MCP server does

The figsnap-mcp MCP server connects an MCP client to the Figma file currently open in Figma desktop. Its tool set can inspect the design, extract selected nodes as PNG, React, HTML, or CSS, edit the canvas when editing is enabled, and share a saved set of components. The package contains the MCP server, a local daemon, and the Figma plugin needed to connect them.

The project is intentionally limited to this workflow. It does not include the broader Figsnap ACP client, relay, account system, chat interface, API browser, session store, harness discovery, or code-export UI.

How it works

The MCP client starts figsnap-mcp over stdio. That process acts as a stateless proxy to the local daemon, which listens on port 3058. The daemon maintains a WebSocket connection to the plugin panel running inside Figma. Figma-specific figma.* access is available only while the plugin is open.

The daemon binds to loopback and uses a token for authenticated communication. On first launch it creates a token at ~/.figsnap-mcp/agent-token with restrictive permissions, then reuses it on later launches. The MCP client normally reads this file itself, so the client configuration does not need a token. The panel receives the token once through its Connect pane and stores the connection details in Figma storage.

Setup and configuration

Install the package globally or let an MCP client fetch it with npx:

Terminal

npm install -g figsnap-mcp

Start the bridge with figsnap-mcp-daemon, then import the package's manifest.json into Figma desktop through Plugins → Development → Import plugin from manifest. Run the Figsnap MCP plugin, paste the daemon token into its Connect pane, and connect it. Finally, register the stdio process with the MCP client:

Terminal

claude mcp add figsnap-mcp -s user -- npx -y figsnap-mcp

A health request to http://127.0.0.1:3058/health can confirm that the daemon and plugin are connected. Start the daemon with --allow-edits or enable Allow edits in the plugin when write operations are needed.

FIGSNAP_MCP_TOKEN supplies a fixed token instead of the token file. FIGSNAP_MCP_URL changes the address used by the MCP client. The daemon supports token rotation with --new-token.

Tools and capabilities

The figsnap-mcp MCP server provides 41 tools covering the following supported operations:

Read information from the open Figma file and current canvas context.
Extract a node as PNG, React, HTML, or CSS.
Edit the Figma canvas when editing is enabled.
Maintain and share a saved set of components.

The exact available responses depend on the plugin being open and connected to the daemon. With the plugin closed, the MCP process cannot reach Figma's figma.* interface.

Limitations and notes

The daemon and plugin must both be running; installing or registering the MCP process alone does not provide Figma data. Editing is disabled by default unless enabled in the plugin or at daemon startup. The connection is local-only, using loopback port 3058, and this package does not provide a relay, login, or network service.

The plugin manifest must use localhost in its allowed domains rather than a literal 127.0.0.1 address, because Figma can reject an IP literal in that field. The project can run beside Figsnap, but it uses its own port, token path, plugin identifier, and prefixed storage keys.

Read the full README View source on GitHub

Tools41

What Figsnap MCP lets your agent do. Expand a tool for its parameters.

Verified live~7.6k tokens of context

Security & health

What it can reach and how reliably it runs — from our own checks, not the maintainer’s claims.

ActiveLast checked Today

Recent health check succeeded.

5/5 checks healthy over the last 40d

What it can do

From the 41 tools this server returned when we ran it; 41 declare their own safety hints.

Can delete or modify data · 27Writes files · 1Handles credentials · 1Makes network requests · 3Read-only tools · 14

Network at startup3 connections

Files written at startupNone

Install scriptsNone

npm provenanceSigned build

Package age47 days

Maintainers1

Observed 2026-10-19 in an isolated sandbox. A description of reach, not a security audit.

Supply-chain signal

No high-severity advisories surfaced by our automated scan.

Critical 0High 0Medium 0Low 0

Scanned 15d ago via OSV.dev · figsnap-mcp (npm)

Adoption & maintenance

Factual signals from GitHub, npm, and our automated checks — not a rating.

npm downloads235Package downloads in the last 30 days.

Last commit1mo agoMost recent push to the default branch.

Availability100%Our rolling endpoint + install checks that succeeded.

Install checkPassedOur sandbox started it and listed its tools.

Tools exposed41Callable tools this server registers over MCP.

Directory activity1 viewsConfig copies, upvotes, and views on AllMCPs.

Reviews

No reviews yet — be the first to share how it worked for you.

Frequently Asked Questions about Figsnap MCP

figsnap-mcp is an MCP server that connects an MCP client to the Figma file open in Figma desktop through a local daemon and plugin. Its main tools read the canvas, extract nodes as PNG, React, HTML, or CSS, make optional edits, and manage saved component sets while the plugin is running.

Install it globally with `npm install -g figsnap-mcp`, or configure your client to run `npx -y figsnap-mcp`. You must also start `figsnap-mcp-daemon`, import the package manifest into Figma, run the plugin, and connect its panel with the daemon token.

Yes, Cursor is named as a supported installation target. Configure Cursor to start `npx -y figsnap-mcp`, then keep the daemon running and the Figsnap MCP plugin open and connected in Figma.

Enable editing by starting the daemon with `--allow-edits` or turning on Allow edits in the plugin's Tools pane. Editing is off by default, and write tools remain unavailable until this setting is enabled.

The daemon stores its generated token at `~/.figsnap-mcp/agent-token`. The MCP process reads that file automatically, while the token must be pasted into the Figma plugin's Connect pane; `FIGSNAP_MCP_TOKEN` can provide a fixed token instead.

Related MCP servers

All in Architecture & Design All alternatives

Add a badge to your READMEShow it’s listed — live SVG, Markdown or HTML.

AllMCPs Directory Badge

Full Badge Customizer

Showcase your server listing on GitHub or your project documentation. Embed this dynamic SVG badge to highlight official listing status and live engagement.

Badge Style:

Live Dynamic SVG Preview

Markdown (GitHub README)

[![AllMCPs](https://allmcps.com/api/badge/figsnap-mcp?style=directory)](https://allmcps.com/mcp/figsnap-mcp)

HTML Embed

<a href="https://allmcps.com/mcp/figsnap-mcp"><img src="https://allmcps.com/api/badge/figsnap-mcp?style=directory" alt="Figsnap MCP on AllMCPs" /></a>

At a glance

Category: Architecture & Design
Transport: STDIO
Runtime: Node.js
Clients: Claude Code, Cursor, VS Code (GitHub Copilot), Claude Desktop, Cline / VS Code, Windsurf, Zed, Roo Code, Continue
Last updated: Oct 8, 2026

GitHub stars0

Last commit1mo ago

npm / month235

69Quality signal: Great · 69/100How this signal is calculated ▾

Server availability25/25

Verified ownership10/20

Documentation & tools29/30

Adoption & activity5/15

Community engagement0/10

A guidance signal from public completeness & health data — not a user rating. New listings start lower and rise as they add docs, get verified, and grow adoption. Signals we can't observe for a listing are skipped, not counted against it.

Own this project?

This listing is pre-filled from public sources. Claim it via your GitHub README, a site badge, or DNS TXT to edit it and earn the Verified badge.

Free dofollow backlink: add your website and place the AllMCPs badge on it — no claim needed. We detect it automatically.

Claim this listing

Figsnap MCP

Connects an open Figma file to an MCP client for extraction, controlled edits, and saved component sets.

InstallRepository Website

Install Figsnap MCP

Pick your client, then add it in one click or paste the config.

STDIONode.js

~/Library/Application Support/Claude/claude_desktop_config.json

claude_desktop_config.json

{
  "mcpServers": {
    "figsnap-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "figsnap-mcp"
      ],
      "env": {
        "FIGSNAP_MCP_TOKEN": "YOUR_VALUE_HERE",
        "FIGSNAP_MCP_URL": "YOUR_VALUE_HERE"
      }
    }
  }
}

Settings → Developer → Edit Config, merge this into mcpServers, then fully quit and reopen Claude Desktop.

Values are written into the snippet above so you can paste it as is. They never leave your browser.

Automated check passed— started and listed 41 tools correctly (2d ago).

Overview

figma
design-tools
developer-tools
mcp

Use cases

Inspect the currently open Figma canvas from an MCP client
Extract selected Figma nodes as PNG, React, HTML, or CSS
Enable an agent to make controlled edits in Figma
Maintain a saved set of reusable components

Key features

Figma plugin bridge
41 MCP tools
PNG, React, HTML, and CSS extraction
Optional canvas editing
Saved component sets
Loopback daemon with token authentication

How Figsnap MCP works

What figsnap-mcp MCP server does

How it works

Setup and configuration

Install the package globally or let an MCP client fetch it with npx:

Terminal

npm install -g figsnap-mcp

Terminal

claude mcp add figsnap-mcp -s user -- npx -y figsnap-mcp

FIGSNAP_MCP_TOKEN supplies a fixed token instead of the token file. FIGSNAP_MCP_URL changes the address used by the MCP client. The daemon supports token rotation with --new-token.

Tools and capabilities

The figsnap-mcp MCP server provides 41 tools covering the following supported operations:

Read information from the open Figma file and current canvas context.
Extract a node as PNG, React, HTML, or CSS.
Edit the Figma canvas when editing is enabled.
Maintain and share a saved set of components.

The exact available responses depend on the plugin being open and connected to the daemon. With the plugin closed, the MCP process cannot reach Figma's figma.* interface.

Limitations and notes

Read the full README View source on GitHub

Tools41

What Figsnap MCP lets your agent do. Expand a tool for its parameters.

Verified live~7.6k tokens of context

Security & health

What it can reach and how reliably it runs — from our own checks, not the maintainer’s claims.

ActiveLast checked Today

Recent health check succeeded.

5/5 checks healthy over the last 40d

What it can do

From the 41 tools this server returned when we ran it; 41 declare their own safety hints.

Can delete or modify data · 27Writes files · 1Handles credentials · 1Makes network requests · 3Read-only tools · 14

Network at startup3 connections

Files written at startupNone

Install scriptsNone

npm provenanceSigned build

Package age47 days

Maintainers1

Observed 2026-10-19 in an isolated sandbox. A description of reach, not a security audit.

Supply-chain signal

No high-severity advisories surfaced by our automated scan.

Critical 0High 0Medium 0Low 0

Scanned 15d ago via OSV.dev · figsnap-mcp (npm)

Adoption & maintenance

Factual signals from GitHub, npm, and our automated checks — not a rating.

npm downloads235Package downloads in the last 30 days.

Last commit1mo agoMost recent push to the default branch.

Availability100%Our rolling endpoint + install checks that succeeded.

Install checkPassedOur sandbox started it and listed its tools.

Tools exposed41Callable tools this server registers over MCP.

Directory activity1 viewsConfig copies, upvotes, and views on AllMCPs.

Reviews

No reviews yet — be the first to share how it worked for you.

Frequently Asked Questions about Figsnap MCP

Yes, Cursor is named as a supported installation target. Configure Cursor to start `npx -y figsnap-mcp`, then keep the daemon running and the Figsnap MCP plugin open and connected in Figma.

Related MCP servers

All in Architecture & Design All alternatives

Add a badge to your READMEShow it’s listed — live SVG, Markdown or HTML.

AllMCPs Directory Badge

Full Badge Customizer

Showcase your server listing on GitHub or your project documentation. Embed this dynamic SVG badge to highlight official listing status and live engagement.

Badge Style:

Live Dynamic SVG Preview

Markdown (GitHub README)

[![AllMCPs](https://allmcps.com/api/badge/figsnap-mcp?style=directory)](https://allmcps.com/mcp/figsnap-mcp)

HTML Embed

<a href="https://allmcps.com/mcp/figsnap-mcp"><img src="https://allmcps.com/api/badge/figsnap-mcp?style=directory" alt="Figsnap MCP on AllMCPs" /></a>

At a glance

Category: Architecture & Design
Transport: STDIO
Runtime: Node.js
Clients: Claude Code, Cursor, VS Code (GitHub Copilot), Claude Desktop, Cline / VS Code, Windsurf, Zed, Roo Code, Continue
Last updated: Oct 8, 2026

GitHub stars0

Last commit1mo ago

npm / month235

69Quality signal: Great · 69/100How this signal is calculated ▾

Server availability25/25

Verified ownership10/20

Documentation & tools29/30

Adoption & activity5/15

Community engagement0/10

Own this project?

This listing is pre-filled from public sources. Claim it via your GitHub README, a site badge, or DNS TXT to edit it and earn the Verified badge.

Free dofollow backlink: add your website and place the AllMCPs badge on it — no claim needed. We detect it automatically.

Claim this listing

Install Figsnap MCP

Use cases

Key features

How Figsnap MCP works

What figsnap-mcp MCP server does

How it works

Setup and configuration

Tools and capabilities

Limitations and notes

What it can do

Supply-chain signal

Adoption & maintenance

Frequently Asked Questions about Figsnap MCP

What is the figsnap-mcp MCP server?

How do I install the figsnap-mcp MCP server?

Does figsnap-mcp work with Cursor?

How do I enable editing with figsnap-mcp?

Where does figsnap-mcp store its token?

AllMCPs Directory Badge

Install Figsnap MCP

Use cases

Key features

How Figsnap MCP works

What figsnap-mcp MCP server does

How it works

Setup and configuration

Tools and capabilities

Limitations and notes

What it can do

Supply-chain signal

Adoption & maintenance

Frequently Asked Questions about Figsnap MCP

What is the figsnap-mcp MCP server?

How do I install the figsnap-mcp MCP server?

Does figsnap-mcp work with Cursor?

How do I enable editing with figsnap-mcp?

Where does figsnap-mcp store its token?

AllMCPs Directory Badge