MCP.so
Sign In

Figma MCP Server

@moonray

Repository

About Figma MCP Server

An mcp server that efificiently generates a node tree and related metadata for a figma node.

#mcp-figma#figma#node-tree

Config

Add this server to your MCP-compatible client using the configuration below.

{
  "mcpServers": {
    "mcp-figma-moonray": {
      "command": "node",
      "args": [
        "client-example.js",
        "https://www.figma.com/file/FILE_ID/PROJECT_NAME?node-id=NODE_ID",
        "2"
      ]
    }
  }
}

Tools

No tools detected

We auto-extract tools from the README. The maintainer can list them under a ## Tools heading to populate this section.

Overview

What is Figma MCP Server?

An MCP (Model Context Protocol) server for analyzing Figma file structures. It extracts node hierarchies from Figma files and can be used both as a REST API server and as an MCP server for LLM integration. It is intended for developers working with Figma design files and AI‑assisted workflows.

How to use Figma MCP Server?

Install the package globally via npm (npm install -g figma-mcp-server) or build from source. Configure your Figma API key in a .env file (variable FIGMA_API_KEY). Start the REST API with npm start or run the MCP CLI with figma-mcp-server --cli. Send analysis requests to the POST /analyze endpoint with a Figma URL and optional depth parameter.

Key features of Figma MCP Server

  • Analyze Figma files to extract node hierarchies
  • Supports both REST API and MCP protocol
  • Configurable node tree depth
  • Simple configuration via .env file
  • Docker support for containerized deployment

Use cases of Figma MCP Server

  • Automating extraction of Figma component trees for design documentation
  • Enabling an LLM to query and reason about Figma file structure
  • Building design review tools that inspect node hierarchies
  • Integrating Figma analysis into CI/CD pipelines for design‑system checks

FAQ from Figma MCP Server

What prerequisites are needed to run the server?

Node.js 16+ and npm or yarn are required. You also need a valid Figma API key.

How do I obtain a Figma API key?

You can generate an API key from your Figma account settings at https://www.figma.com/developers/api#access-tokens.

Can the server be used as a standalone REST API?

Yes. Run npm start to start an Express server on port 3000 (or a custom port set in .env). Use the POST /analyze endpoint to analyze files.

What does the depth parameter do in an analysis request?

It controls how many levels of the node tree are returned. If omitted, the server uses a default depth.

Is Docker deployment supported?

Yes. A Dockerfile is provided. Build the image with docker build -t figma-mcp-server . and run it with docker run -p 3000:3000 --env-file .env figma-mcp-server.

Frequently asked questions

What prerequisites are needed to run the server?

Node.js 16+ and npm or yarn are required. You also need a valid Figma API key.

How do I obtain a Figma API key?

You can generate an API key from your Figma account settings at https://www.figma.com/developers/api#access-tokens.

Can the server be used as a standalone REST API?

Yes. Run `npm start` to start an Express server on port 3000 (or a custom port set in `.env`). Use the `POST /analyze` endpoint to analyze files.

What does the `depth` parameter do in an analysis request?

It controls how many levels of the node tree are returned. If omitted, the server uses a default depth.

Is Docker deployment supported?

Yes. A Dockerfile is provided. Build the image with `docker build -t figma-mcp-server .` and run it with `docker run -p 3000:3000 --env-file .env figma-mcp-server`.

Comments

Basic information

Category

Media & Design

License

MIT

Transports

stdio

Author

moonray

More Media & Design MCP servers

diggercamp

Tommaso Savorana (ti es)

diggercamp finds independent music by how it sounds. Paste any Bandcamp, YouTube or SoundCloud link and get the closest sonic matches from 4M+ independent tracks — matched by rhythm, timbre, key and energy, not genre tag

Katto

Katto

AI video clipping MCP server: turn long videos, podcasts and Twitch VODs into scored, captioned 9:16 shorts from Claude, Cursor, ChatGPT and any MCP client.

Vibe Design System

mondaycom

🎨 Vibe Design System - Official monday.com UI resources for application development in React.js

657

KiCAD MCP: AI-Assisted PCB Design

mixelpixx

KiCAD MCP is a Model Context Protocol (MCP) implementation that enables Large Language Models (LLMs) like Claude to directly interact with KiCAD for printed circuit board design.

1.5K

AI Manga & Anime Generator - Mangii MCP

AAAIStudio

Public Mangii MCP metadata (ai.mangii/manga). Remote Streamable HTTP at mcp.mangii.ai.