Which integrations are available for this server?

Provides tools for parsing, analyzing, and exporting assets from local .fig files, including page listing, node details, text extraction, color extraction, image and vector export, and design spec generation, enabling AI agents to work with Figma design data offline without API access.

How do I use @echobt/figma-mcp?

1. Click on "Deploy Server". 2. Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state. 3. In the chat, type @ followed by the MCP server name and your instructions, e.g., "@@echobt/figma-mcp list pages in /path/to/design.fig" That's it! The server will respond to your query, and you can continue using it as needed. Here is a step-by-step guide with screenshots.

@echobt/figma-mcp

by echobt

Overview Schema Source Related Servers Discussions Admin

TypeScript

Local

@echobt/figma-mcp

Complete fork of bilalba/fig-mcp — local MCP server for reading and rendering .fig files offline (no Figma API, no PAT, no rate limits).

Maintained at echobt/figma-mcp.

Why this fork

Upstream is a solid fig-kiwi parser + experimental SVG renderer. This fork hardens it for agent design-to-code workflows on large local archives (hundreds of MB, 100k+ nodes):

Area	Improvement
File reading	Lazy ZIP `ImageStore` — only inflate images on demand (canvas/meta/thumbnail eager)
Screenshots	`pixelPerfect` mode (no 800×600 clamp), `outputPath` disk write, MCP `image` + JSON meta
Agent assets	`export_asset_pack` (true SVG/files + AGENTS.md) — forbids inventing paths
Images	`get_image` / `get_thumbnail` return real MCP image content (base64), optional `outputPath`
INSTANCE	Expand symbol children even when overrides are empty (was incorrectly skipped)
Typography	Letter-spacing units (`PERCENT` → px via font size) normalized at parse
Tests	node:test suite + TAOSCAN smoke harness

Verified against a large real file (TAOSCAN - Mockups.fig, ~391MB, 23 pages, ~229k nodes, 1219 images).

Related MCP server: FreeMCP for Figma

Install

npm install -g @echobt/figma-mcp
# or
npx @echobt/figma-mcp --help

Binaries (identical): figma-mcp, fig-mcp.

Quick start (Claude / Cursor / OpenCode)

# Claude Code
claude mcp add figma-mcp -- npx @echobt/figma-mcp

# Or pin a local path
claude mcp add figma-mcp -- node /path/to/figma-mcp/dist/index.js

Example prompts:

Parse /path/to/design.fig, list pages, then export a design spec for the Home frame and take a pixelPerfect screenshot to /tmp/home.png.

CLI

Command	Description
`figma-mcp`	Start MCP server (stdio) + optional image HTTP sidecar
`figma-mcp viewer <file> [port]`	Web viewer (default port 3000)
`figma-mcp inspect <file> [cmd]`	`list` / `summary` / `stats` / `schema` / `json` / `raw`
`figma-mcp --help` / `--version`	Help / version

MCP tools

Document structure

Tool	Description
`parse_fig_file`	Simplified document tree
`get_document_summary`	Paginated text tree
`get_tree_summary`	Hierarchical drill-down
`list_pages`	All canvases
`get_page_contents`	Contents of one page

Nodes

Tool	Description
`find_nodes`	By type or name
`get_node_details`	By path
`get_node_by_id`	By GUID `sessionID:localID` (also accepts `sessionID-localID`)
`get_layout_info`	Inferred flex-like layout

Content

Tool	Description
`get_text_content`	Extract text
`get_colors`	Unique solid colors
`list_nodes_with_fills`	Nodes with fills

Images & rendering

Tool	Description
`list_images`	Image inventory (lazy metadata)
`get_image`	MCP image content + JSON meta; optional `outputPath`
`get_thumbnail`	Document thumbnail as MCP image
`render_screen`	PNG of node; default `trueGeometry=true` (baked paths → SVG → resvg); `pixelPerfect`, `outputPath`
`get_vector`	Export real geometry SVG/PDF/PNG — prefer `outputPath`, open the file

Agent copy (fork)

Tool	Description
`get_mcp_guide`	Read first. Full rules + UCs (`MCP_GUIDE.md`). No file needed. Also resource `figma-mcp://guide`.
`export_asset_pack`	Primary implement tool. Writes `MANIFEST.json`, `AGENTS.md`, `images/`, `vectors/*`, `nodes/{id}/node.svg`+`node.png`+`design-spec.json`. Open these files — never invent SVG paths.
`export_design_spec`	CSS + layout + tokens + tree + text for a node (JSON, optional `outputPath`)
`export_node_assets` / `save_node_assets`	Write real images + true-geometry SVG + PNG for one node to a directory

Debug

Tool	Description
`get_schema_info`	Kiwi schema meta
`get_raw_message`	Raw decoded message (truncated)
`list_archive_contents`	ZIP entries
`clear_cache`	Drop parsed cache + inflated image LRU

Agent guide (required reading)

Canonical rules + use cases: MCP_GUIDE.md, or call get_mcp_guide / read resource figma-mcp://guide.

Server initialize also sends short instructions pointing agents at that guide.

Agent workflow (recommended)

Golden rule: never invent SVG d paths or re-draw icons. Always use exported files.

get_mcp_guide — hard rules + UC catalog (once per session)
list_pages / get_tree_summary — map the file
find_nodes or get_node_by_id — pick a frame (session:local)
export_asset_pack with outputDir — dumps real assets + AGENTS.md policy
Read MANIFEST.json and open nodes/*/node.svg, vectors/*.svg, images/*
export_design_spec for exact text/CSS tokens
Implement with HTML/CSS + file references (img/src or copied SVG files)
Optional render_screen with trueGeometry: true (default) + outputPath for visual QA

get_vector also exports real baked geometry — prefer outputPath and open the file.

Node IDs look like 3779:22748 (from the web viewer or any tool that returns id / nodeId).

How it works

.fig files are ZIP archives (canvas.fig fig-kiwi binary, meta.json, thumbnail.png, images/).
Schema embedded in each file is decoded with kiwi.
Flat nodeChanges are rebuilt into a tree.
Images stay in the archive until requested (ImageStore).
Subtrees render to SVG → PNG via @resvg/resvg-js.

Develop

npm install
npm run build
npm test
FIG_MCP_TAOSCAN="/path/to/file.fig" npm run smoke:taoscan

Smoke writes evidence under /tmp/opencode/fig-mcp-work/qa-out/ when available.

Requirements

Node.js 18+

Limitations

.fig format is undocumented and may change
Local files only (use official Figma MCP for cloud files)
Vector export uses Figma baked fillGeometry/strokeGeometry (true path data from the file). Screenshots use that SVG via resvg — not hand-approximated icons. Complex blend modes / full BOOLEAN merge may still be incomplete.
Agents must use export_asset_pack files, not recreated path strings.
Very large files still keep the ZIP buffer in memory (images are lazy; canvas decode can still be multi‑GB on enormous docs)

License

MIT — see LICENSE.

Upstream credit: bilalba/fig-mcp by bilal; kiwi by Evan Wallace; MCP TypeScript SDK.

Available Tools

26 tools

clear_cacheB

Clear the file cache. Useful if the .fig file has been modified.

Inputs: filePath.

export_asset_packA

THE agent packaging tool. Writes a directory with MANIFEST.json, AGENTS.md (MUST NOT invent SVG paths), images/{hash}.ext real binaries, vectors/* true-geometry SVGs, nodes/{id}/node.svg+node.png+design-spec.json. Returns manifest summary + absolute outputDir + policy banner. Never dumps full images as base64. Agents must read/copy files from the pack.

Inputs: filePath (required), outputDir (required), nodeId, maxDepth, +5 more.

export_design_specB

Export a condensed design spec for a node: bounds, css, tokens, layout, tree, and text content.

Inputs: nodeId (required), filePath (required), maxDepth.

export_node_assetsA

Export REAL assets for one node: image binaries from the .fig store, true-geometry node.svg (baked fillGeometry/strokeGeometry), and node.png. Returns list of written absolute paths only — open those files; never invent SVG paths.

Inputs: nodeId (required), filePath (required), outputDir (required), writePng, +1 more.

find_nodesA

Find nodes in the document by type or name. Useful for locating specific components, frames, or text elements.

Inputs: filePath (required), name, type.

get_colorsA

Extract all unique colors used in the document, including fills and strokes.

Inputs: filePath (required).

get_document_summaryA

Get a text summary of the document structure showing node types, names, and dimensions in a tree format. Supports pagination to handle large documents.

Inputs: filePath (required), offset, maxNodes.

get_imageA

Get a specific image from the .fig file as a resource. Use the hash from list_images.

Inputs: filePath (required), imageHash (required), outputPath.

get_layout_infoA

Get layout and spacing information for a node. Returns inferred flexbox-like properties including direction, gap, padding, and alignment.

Inputs: filePath (required), nodePath (required).

get_mcp_guideA

MANDATORY first read for agents. Returns the full MCP_GUIDE (hard rules, use cases UC-01..UC-15, tool matrix, anti-patterns, pack layout, ID formats). Call once per session before implementing UI from a .fig. No filePath required. Equivalent resource: figma-mcp://guide.

Inputs: section.

get_node_by_idB

Get detailed information about a specific node by its GUID. Node ID format: 'sessionID:localID' (e.g., '457:1607'). Hyphen format also accepted.

Inputs: nodeId (required), filePath (required), compact, maxDepth, +5 more.

get_node_detailsB

Get detailed information about a specific node by its path in the document tree. Use format like 'Page 1/Frame Name/Child Name'.

Inputs: filePath (required), nodePath (required), compact, maxDepth, +5 more.

get_page_contentsB

Get the contents of a specific page, including all top-level frames and their immediate children.

Inputs: filePath (required), pageName (required).

get_raw_messageA

Get the raw decoded message from the .fig file. Warning: can be very large. Use for debugging only.

Inputs: filePath (required), maxSize.

get_schema_infoB

Get the kiwi schema information from the .fig file. Useful for debugging and understanding the file format.

Inputs: filePath (required).

get_text_contentC

Extract all text content from the document or a specific node path.

Inputs: filePath (required), nodePath.

get_thumbnailB

Get the document thumbnail image as a resource.

Inputs: filePath (required), outputPath.

get_tree_summaryA

Get hierarchical summary with child counts for drill-down navigation. Returns high-level structure without full node details.

Inputs: filePath (required), depth, nodePath.

get_vectorA

Exports REAL geometry from the .fig blob (fillGeometry/strokeGeometry commandsBlob). Agents must OPEN the resulting file — do not recreate paths. Prefer outputPath. For multi-asset work use export_asset_pack. When format=svg without outputPath, SVG text is returned but you should still save/open it rather than rewriting d attributes.

Inputs: format (required), nodeId (required), filePath (required), width, +3 more.

list_archive_contentsB

List all files contained in the .fig archive.

Inputs: filePath (required).

list_imagesA

List all images in the .fig file with their metadata. Returns image hashes, dimensions, and which nodes reference them.

Inputs: filePath (required).

list_nodes_with_fillsB

List nodes that have fill paints, with summary of paint types and optional image references.

Inputs: filePath (required), maxResults, includeImageRefs.

list_pagesB

List all pages (canvases) in the .fig file.

Inputs: filePath (required).

parse_fig_fileC

Parse a .fig file and return its document structure. Returns a simplified representation suitable for understanding the design hierarchy, layout, and styling.

Inputs: filePath (required), maxDepth.

render_screenA

Screenshot ground truth of a node subtree. Prefer options.outputPath and OPEN the PNG on disk — do not redraw. Default trueGeometry=true uses baked Figma path geometry (fillGeometry/strokeGeometry) then resvg. Export packs via export_asset_pack for agent-safe files.

Inputs: nodeId (required), filePath (required), options.

save_node_assetsA

Write REAL image binaries + true-geometry SVG + PNG for a node to outputDir. Returns written paths only. Prefer export_asset_pack for full agent packs with AGENTS.md policy.

Inputs: nodeId (required), filePath (required), outputDir (required), writePng.

Tool Schema Changelog

Recent tool additions, removals, and schema changes observed during successful MCP inspections.

Loading tool schema changelog…

Deploy Server

Claude Code, inside the Godot 4 editorFlockbay puts an AI agent in the real Godot 4 editor: it writes GDScript, runs your game and fixes what breaks. Free, or bring your own Claude Code or Codex.flockbay.comAd

TDQS

B3.4/5.0

Scored 2026-07-28 23:40 across 26 tools

Disambiguation2/5

Many tools have overlapping purposes, such as multiple export functions (export_design_spec, save_node_assets, export_node_assets, export_asset_pack, get_vector, render_screen) and several for node retrieval (get_node_details, get_node_by_id, find_nodes). Descriptions try to differentiate but the similarity causes ambiguity.

Naming Consistency4/5

All tool names use snake_case and start with a verb, providing a coherent pattern. However, the verb choice varies (export, save, get, parse, find, list, render) without a strict hierarchical convention, making it slightly less predictable.

Tool Count3/5

26 tools is high for a single-domain server. While the domain (Figma file analysis) is broad, many tools could be consolidated (e.g., merging export functions). The count feels slightly excessive and may overwhelm agents.

Completeness5/5

The tool set comprehensively covers Figma file parsing, node navigation, asset export, image extraction, color and text analysis, and schema info. No obvious gaps for the intended purpose of reading and extracting design data.

Maintenance

ActivityInactive

ResponsivenessNo recent community issues

Resources

Related MCP Connectors

ready→made MCPA
dev.levels
Deterministic Figma to Elementor, Gutenberg, Oxygen, Etch and HTML layouts for AI assistants.
Design Tools Content Management Systems Developer Tools
31
https://api.levels.dev/mcp
DocmintA
io.github.Noju-io
PDF and image tools for AI agents: compress, merge, split, OCR, sign. Runs locally, never uploads.
Image & Video Processing
31
https://docmint.io/api/mcp
NexDoc DesignA
design.nexdoc.mcp
Give your AI agents a design superpower. Generate, edit, and publish publication-grade decks, reports, landing pages, resumes, and marketing visuals directly within your agent workflow. Delivering frontier-level design quality at 3× the speed and 53× lower cost -from conversational prompt to live link or vector PDF in minutes.
Design Tools Marketing
161
https://mcp.nexdoc.design/mcp
convert-pdf-to-word-docxA
io.github.theluckystrike
Convert PDF pages into editable Word-ready text from your AI chat, all offline.
File Systems Workplace & Productivity
151
https://mcp.zovo.one/mcp/convert-pdf-to-word-docx

Related MCP Servers

figma-mcp
Design Tools Developer Tools
Anakintano
F
license
B
quality
D
maintenance
Enables AI agents to read, inspect, and export Figma designs programmatically. Provides tools for listing components, styles, and exporting assets in various formats.
Updated 8 months ago (2026-03-12 06:48 UTC)
5
1
-
FreeMCP for Figma
Design Tools Coding Agents
w4ndaja
A
license
Not graded
quality
D
maintenance
Enables AI coding agents to read and write a user's Figma file through the Figma Plugin API, offline and privately, without API tokens or rate limits.
Updated 3 months ago (2026-08-18 04:24 UTC)
78 npm
MIT
figctx-mcp
Design Tools
POLAX7
A
license
Not graded
quality
C
maintenance
Enables agents to extract, inspect, search, and bundle design context from local Figma .fig files entirely offline, exposing frame summaries, node context, style tokens, assets, vector SVGs, and visual-match review via MCP.
Updated 2 months ago (2026-09-11 10:05 UTC)
MIT
figme
Design Tools Developer Tools
ntson9p
A
license
A
quality
B
maintenance
Enables AI agents to read and inspect local Figma .fig files entirely offline, exposing document structure, geometry, styles, text, components, variables, and embedded images via MCP tools.
Updated 8 hours ago (2026-11-13 16:28 UTC)
12
100 npm
3
MIT

@echobt/figma-mcp

Why this fork

Install

Quick start (Claude / Cursor / OpenCode)

CLI

MCP tools

Document structure

Nodes

Content

Images & rendering

Agent copy (fork)

Debug

Agent guide (required reading)

Agent workflow (recommended)

How it works

Develop

Requirements

Limitations

License

Available Tools

Tool Schema Changelog

TDQS

Maintenance

Resources

Related MCP Connectors

Related MCP Servers

figma-mcp

FreeMCP for Figma

figctx-mcp

figme