Figma MCP Server

Figma MCP Server with full API functionality

Catalog onlyCatalog onlySTDIO

Overview

Figma MCP Server is a server designed to interact with the Figma API, providing a complete set of API methods through the Model Context Protocol.

To use the Figma MCP Server, you need to set up your Figma API token and install the server via Smithery or by cloning the repository. You can then call various API methods to interact with Figma files and components.

Implements all Figma API methods as MCP tools. - Allows fetching user details, file contents, comments, and more. - Supports creating and managing webhooks for real-time updates.

Retrieve and manipulate Figma files programmatically.
Automate comments and feedback on design files.
Integrate Figma with other applications through webhooks.

Add to your AI client

Use these steps to connect Figma MCP Server in Cursor, Claude, VS Code, and other MCP-compatible apps. The same JSON appears in the Use with menu above for one-click copy.

Cursor

Add this to your .cursor/mcp.json file in your project root, then restart Cursor.

.cursor/mcp.json

{
  "mcpServers": {
    "mcp-figma-jayarrowz": {
      "command": "npx",
      "args": [
        "@jayarrowz/mcp-figma",
        "--figma-token",
        "your_figma_api_key"
      ]
    }
  }
}

Claude Desktop

Add this server entry to the mcpServers object in your Claude Desktop config, then restart the app.

~/Library/Application Support/Claude/claude_desktop_config.json (macOS) or %APPDATA%\Claude\claude_desktop_config.json (Windows)

{
  "mcpServers": {
    "mcp-figma-jayarrowz": {
      "command": "npx",
      "args": [
        "@jayarrowz/mcp-figma",
        "--figma-token",
        "your_figma_api_key"
      ]
    }
  }
}

Claude Code

Add this to your project's .mcp.json file. Claude Code will detect it automatically.

.mcp.json (project root)

{
  "mcpServers": {
    "mcp-figma-jayarrowz": {
      "command": "npx",
      "args": [
        "@jayarrowz/mcp-figma",
        "--figma-token",
        "your_figma_api_key"
      ]
    }
  }
}

VS Code (Copilot)

Add this to your .vscode/mcp.json file. Requires the GitHub Copilot extension with MCP support enabled.

.vscode/mcp.json

{
  "servers": {
    "mcp-figma-jayarrowz": {
      "type": "stdio",
      "command": "npx",
      "args": [
        "@jayarrowz/mcp-figma",
        "--figma-token",
        "your_figma_api_key"
      ]
    }
  }
}

Windsurf

Add this to your Windsurf MCP config file, then restart Windsurf.

~/.codeium/windsurf/mcp_config.json

{
  "mcpServers": {
    "mcp-figma-jayarrowz": {
      "command": "npx",
      "args": [
        "@jayarrowz/mcp-figma",
        "--figma-token",
        "your_figma_api_key"
      ]
    }
  }
}

Cline

Open Cline settings, navigate to MCP Servers, and add this server configuration.

Cline MCP Settings (via UI)

{
  "mcpServers": {
    "mcp-figma-jayarrowz": {
      "command": "npx",
      "args": [
        "@jayarrowz/mcp-figma",
        "--figma-token",
        "your_figma_api_key"
      ]
    }
  }
}

FAQ

What is required to run the Figma MCP Server?

You need Node.js (v16 or later) and a valid Figma API token.

Can I use this server for large Figma files?

Yes, but you may need to adjust the depth parameter for fetching file data.

Is the Figma MCP Server open source?

Yes, it is licensed under the MIT License, allowing free use and modification.

Developer tools