Figma

Figma MCP server for accelerating layout development

python

19

GitHub Stars

python

Language

6 months ago

First Indexed

2 months ago

Catalog Refreshed

Documentation & install

Readme and setup notes from the catalogue, plus a client-ready config you can copy for your MCP host.

Installation

Add the following to your MCP client configuration file.

Configuration

View docs

{
  "mcpServers": {
    "kdoronin-figma_mcp": {
      "command": "python",
      "args": [
        "-m",
        "src.figma_mcp.server",
        "--server",
        "localhost:3055"
      ],
      "env": {
        "PYTHONPATH": "/absolute/path/to/figma_mcp"
      }
    }
  }
}

You run a Python-based MCP server that connects to Figma via WebSocket to read data, analyze designs, and export assets. This server exposes a safe set of read-only tools that let you inspect documents, components, styles, and annotations, while keeping changes and element creation blocked for safety.

How to use

Start the MCP server locally, connect your MCP client, and use the available tools to read data from Figma. Begin by launching the server, then attach your MCP cursor or client to the channel you’ll receive from the server. Use the provided tools to fetch document info, node data, styles, and annotations, or to export nodes as images for analysis and reporting.

How to install

Prerequisites: Python installed on your system and a modern shell. You will run a local MCP server that communicates with a Figma WebSocket proxy.

Step by step commands to set up the environment and install dependencies.

# 1) Prepare a Python virtual environment
cd python-version
python -m venv venv
source venv/bin/activate  # Linux/Mac
# or venv\Scripts\activate  # Windows

# 2) Install dependencies
pip install -r requirements.txt

Additional setup and configuration

Run the WebSocket proxy that coordinates connections on port 3055, then run the MCP server and connect from your MCP client.

Start the WebSocket proxy (if you are using a dedicated proxy) and then start the MCP server using Python.

# Start the WebSocket proxy
python websocket_proxy.py --port 3055 --debug

# Start the MCP server (one common form)
python -m src.figma_mcp.server --server localhost:3055

Security and safety considerations

Only read operations are permitted. The server does not support creating elements, changing styles, or modifying nodes. It filters sensitive data and validates all inputs.

Examples of common tasks

Fetch document info, inspect a node, scan text nodes, get styles, export a node as an image, or retrieve annotations.

Notes on Cursor integration

To integrate with the Cursor MCP client, configure the MCP server in your Cursor settings, and obtain a Channel ID after connecting to the server.

Available tools

join_channel

Attach to a communication channel to establish a link with the Figma MCP server.

get_document_info

Retrieve information about the current Figma document.

get_selection

Obtain details about the current selection in Figma.

read_my_design

Fetch detailed information about the current selection, including node details.

get_node_info

Get information about a specific node by its ID.

get_nodes_info

Obtain information about multiple nodes by their IDs.

get_node_children

Get IDs of all child nodes with full recursive depth.

get_styles

Retrieve all styles from the document.

get_local_components

Fetch all local components in the document.

get_instance_overrides

Get overrides for a component instance.

scan_text_nodes

Scan text nodes within a given node for content.

scan_nodes_by_types

Scan nodes by specific types (TEXT, RECTANGLE, FRAME).

export_node_as_image

Export a node as an image in formats like PNG, JPG, SVG, or PDF.

get_annotations

Retrieve annotations for a node or entire document.

get_reactions

Obtain interactive reactions/links for nodes.