Skip to main content
Glama
Sign In
enesjakozh

Figma MCP Server

by moonray
GitHub
TypeScript
MIT License
2
OverviewInspectNewSchemaRelated ServersReviewsScore
Need Help?View Source CodeReport Issue

Integrations

  • Allows analyzing Figma file structures by extracting node hierarchies through the Figma API

Figma MCP Server

An MCP (Model Context Protocol) server for analyzing Figma file structures.

Features

  • Analyze Figma files to extract node hierarchies
  • Supports both REST API and MCP protocol
  • Configurable node tree depth

Prerequisites

  • Node.js 16+
  • npm or yarn
  • A Figma API key

Installation

From npm

npm install -g figma-mcp-server

From source

git clone https://github.com/yourusername/mcp-figma.git cd mcp-figma npm install npm run build

Configuration

Copy the example environment file and add your Figma API key:

cp .env.example .env

Then edit the .env file and add your Figma API key:

FIGMA_API_KEY=your_figma_api_key_here

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

Usage

As a REST API Server

Start the server:

npm start

This will start an Express server on port 3000 (or the port specified in your .env file).

API Endpoints
  • GET /health - Health check endpoint
  • GET /openapi.json - OpenAPI specification
  • GET /mcp.json - MCP manifest
  • POST /analyze - Analyze a Figma file

Example request to the analyze endpoint:

curl -X POST http://localhost:3000/analyze \ -H "Content-Type: application/json" \ -d '{"figmaUrl": "https://www.figma.com/file/FILE_ID/PROJECT_NAME?node-id=NODE_ID", "depth": 2}'

As an MCP Server

The server can be used directly by an LLM through the MCP protocol:

figma-mcp-server --cli

Or if running from source:

npm run start -- --cli

Client Example

A simple client example is included. To use it:

node client-example.js https://www.figma.com/file/FILE_ID/PROJECT_NAME?node-id=NODE_ID 2

The last parameter is the optional depth parameter.

Development

Running in Development Mode

npm run dev

Testing

npm test

Docker

A Dockerfile is provided for containerized deployment:

docker build -t figma-mcp-server . docker run -p 3000:3000 --env-file .env figma-mcp-server

License

MIT

You must be authenticated.

A
security – no known vulnerabilities
A
license - permissive license
A
quality - confirmed to work

hybrid server

The server is able to function both locally and remotely, depending on the configuration or use case.

Tools

Facilitates the analysis of Figma file structures by extracting node hierarchies, accessible via REST API or MCP protocol.

  1. Features
    1. Prerequisites
      1. Installation
        1. From npm
        2. From source
      2. Configuration
        1. Usage
          1. As a REST API Server
          2. As an MCP Server
          3. Client Example
        2. Development
          1. Running in Development Mode
          2. Testing
        3. Docker
          1. License

            Related Resources

            Related MCP Servers

            • Figma MCP Server

              TimHolden
              A
              security
              F
              license
              A
              quality
              Enables seamless interaction with Figma via the Model Context Protocol, allowing LLM applications to access, manipulate, and track Figma files, components, and variables.
              Last updated -
              2
              106
              TypeScript
              • Apple

            • Figma MCP Server

              GLips
              -
              security
              A
              license
              -
              quality
              Enables Cursor to access Figma files through the Model Context Protocol, enhancing its ability to accurately interpret and utilize design data for code generation.
              Last updated -
              5
              14,596
              6,386
              TypeScript
              MIT License
              • Linux
              • Apple

            • mcp-figma

              thirdstrandstudio
              -
              security
              A
              license
              -
              quality
              Figma MCP with full API functionality
              Last updated -
              54
              16
              TypeScript
              MIT License
              • Apple

            • FigmaMind MCP Server

              joao-loker
              -
              security
              F
              license
              -
              quality
              Extracts components from Figma designs and transforms them into standardized JSON format for easy consumption by AI models and tools for interface reconstruction.
              Last updated -
              TypeScript

            View all related MCP servers

            Appeared in Searches

            New MCP Servers

            ID: 4xg15vn8hw