Figma MCP

Name: Figma MCP
Author: scalably-io

Verified · scalably.io

MCP server by scalably-io · updated 8 days ago · ★ 0

Score 33

Figma MCP: list frames in a file and fetch one frame's JSON and image safely. 2 tools. Figma MCP is published by scalably.io from its verified domain in the official MCP Registry.

Install Add to Cursor Add to VS Code GitHub Website

Yours? Claim it

Works withClaude Code Claude Desktop Cursor Codex Gemini CLI VS Code Windsurf Antigravity CLI

Maintenance

Last commit 8 days ago

Licence

MIT: permissive, fine for commercial use

Quality

Clear description, published package or server URL, original repository

Security

Not checked yet. What we check

What you need

Setting	Needed	What it is
`FIGMA_TOKEN`Environment variable, secret	Required	Figma personal access token with file_content:read
`FIGMA_API_BASE_URL`Environment variable	Optional	Figma REST API base URL, default https://api.figma.com/v1
`FIGMA_REQUEST_TIMEOUT_MS`Environment variable	Optional	Per-request timeout in milliseconds, default 60000
`FIGMA_MAX_JSON_BYTES`Environment variable	Optional	Upper bound on a Figma JSON response in bytes, default 104857600
`FIGMA_MAX_FRAME_BYTES`Environment variable	Optional	Upper bound on a downloaded frame PNG in bytes, default 104857600
`FIGMA_OUTPUT_ROOT`Environment variable	Optional	Directory that all fetch_frame output directories must stay below, default ./figma-output
`FIGMA_ALLOW_HTTP_FOR_TESTS`Environment variable	Optional	Test suite only: set to 1 to allow a plain-HTTP loopback API base. Never set it in normal use

From the publisher's entry in the official MCP Registry. Required settings are already in the install config below as placeholders.

Install Figma MCP

Built from the published package, never by AI

claude mcp add figma-mcp -e FIGMA_TOKEN=YOUR_FIGMA_TOKEN -- npx -y @scalably-io/figma-mcp

Run in your terminal. Add --scope user to use it in every project.

Step-by-step: install Figma MCP in Claude Code

{
  "mcpServers": {
    "figma-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "@scalably-io/figma-mcp"
      ],
      "env": {
        "FIGMA_TOKEN": "YOUR_FIGMA_TOKEN"
      }
    }
  }
}

Settings, Developer, Edit config. Paste into claude_desktop_config.json and restart.

Step-by-step: install Figma MCP in Claude Desktop

{
  "mcpServers": {
    "figma-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "@scalably-io/figma-mcp"
      ],
      "env": {
        "FIGMA_TOKEN": "YOUR_FIGMA_TOKEN"
      }
    }
  }
}

Add to ~/.cursor/mcp.json (all projects) or .cursor/mcp.json (this project).

Step-by-step: install Figma MCP in Cursor

{
  "servers": {
    "figma-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "@scalably-io/figma-mcp"
      ],
      "env": {
        "FIGMA_TOKEN": "YOUR_FIGMA_TOKEN"
      }
    }
  }
}

Add to .vscode/mcp.json. VS Code uses "servers", not "mcpServers".

Step-by-step: install Figma MCP in VS Code

codex mcp add figma-mcp --env FIGMA_TOKEN=YOUR_FIGMA_TOKEN -- npx -y @scalably-io/figma-mcp

Step-by-step: install Figma MCP in Codex

{
  "mcpServers": {
    "figma-mcp": {
      "command": "npx",
      "args": [
        "-y",
        "@scalably-io/figma-mcp"
      ],
      "env": {
        "FIGMA_TOKEN": "YOUR_FIGMA_TOKEN"
      }
    }
  }
}

Add to ~/.gemini/config/mcp_config.json (all projects) or .agents/mcp_config.json (this project).

Step-by-step: install Figma MCP in Antigravity CLI

gemini mcp add figma-mcp npx -y @scalably-io/figma-mcp

Gemini CLI was replaced by Antigravity CLI in June 2026 and remains only for enterprise licences and paid API keys.

Step-by-step: install Figma MCP in Gemini CLI

MCP servers run with your permissions and can read what you give them access to. Some need an API key: check the README and add it under env in the figma-mcp block.

Weekly newsletter

Like Figma MCP? Get the best new MCP servers every week

The best new tools, security warnings before you install something risky, and one practical tip. Free, three minute read.

Alternatives to Figma MCP

All alternatives →

GitDiagram ahmedkhaleel2004

100

Architecture diagrams, explanations and Mermaid source for public GitHub repositories.

AAA Remote 18k

draw.io jgraph

100

Create draw.io diagrams in chat from Mermaid or XML, shown live and interactive. 10,000+ shapes.

AAA Remote 5.7k

Agent-Native PlanBuilderIO

Structured visual plans and PR recaps with diagrams, prototypes, annotations, and sharing

AAA Remote 7.4k

Figma-Context-MCPGLips

Give your coding agent access to your Figma data. Implement designs in any framework in one-shot.

AAA Local 56k/wk

Unity-MCPIvanMurzak

Make 3D games in Unity Engine with AI. MCP Server + Plugin for Unity Editor and Unity games.

AAA Local 4.5k

Visual Explainer nicobailon

Agent skill that generates beautiful HTML pages for diagrams, diff reviews, plan reviews, slide decks, and data tables

AAA Local 11k

Figma MCP vs GitDiagram Figma MCP vs draw.io Figma MCP vs Agent-Native Plan

Figma MCP: common questions

How do I install Figma MCP?

In Claude Code run claude mcp add figma-mcp -e FIGMA_TOKEN=YOUR_FIGMA_TOKEN -- npx -y @scalably-io/figma-mcp. For Claude Desktop, Cursor and VS Code, paste the config shown above and restart. See the install guides.

Is Figma MCP the official server?

Figma MCP is published by scalably.io from its verified domain in the official MCP Registry.

Is Figma MCP free?

The code is published under the MIT licence. The service it connects to may have its own pricing.

Is Figma MCP safe to use?

It scores 33 of 100. Grades: maintenance A, licence A, quality C. The security check has not run for it yet. Review the code before you install. How grades work.

What are alternatives to Figma MCP?

Similar MCP servers: GitDiagram, draw.io, Agent-Native Plan, Figma-Context-MCP.

Does Figma MCP work with ChatGPT?

Not directly. It runs locally, and ChatGPT only connects to remote servers with a URL. Use it in Claude Code, Claude Desktop, Cursor, VS Code or Codex.