← Back to directory
F

Framelink MCP for Figma

Community
Give AI coding agents access to Figma design data.
Category
Dev Tools #158 of 438
Stars
★ 16.0k Very popular
Transport
stdio (local process)
Runtime
Node.js
Credentials
API key / credential required
License
MIT
Last commit
57FMRS · C

An MIT-licensed open-source MCP server for providing Figma layout and styling context to Cursor and other AI coding tools. The manifest lists version 0.6.4, the npm package figma-developer-mcp, and stdio transport.

Strongest · Setup experience 13/20 Weakest · Reliability 9/20

Reliability
9/20
Security and permissions
11/20
Maintenance
11/20
Documentation
13/20
Setup experience
13/20
Why each score
Reliability 9/20
The manifest declares an npm package, stdio transport, and required FIGMA_API_KEY, while the README describes a plausible basic invocation flow. However, there is no evidence of declared tools, source code, tests, CI, error handling, or dependency locking, so initialization, tool behavior, and diagnosable failures cannot be verified; the static calibration therefore keeps this at or below 12.
Security and permissions 11/20
The manifest marks the Figma token as required and secret, and the README explains that it is used to access Figma data, so the primary credential requirement is disclosed. Points are deducted because the README examples pass the token as a command-line argument, which may expose it through process metadata, and there is no evidence of permission scoping, data boundaries, network-flow disclosure, token rotation, or confirmation for dangerous operations. No listed red-line risk is evidenced.
Maintenance 11/20
The repository is not archived, provides an MIT license, and identifies version 0.6.4 with an npm package, indicating basic release and licensing information. Points are deducted because the supplied material does not establish sustained commits, dependency updates, issue response, a security disclosure channel, or clear maintenance governance; stars and open-issue counts do not add points.
Documentation 13/20
The README covers purpose, workflow, Figma token preparation, MacOS/Linux and Windows configuration examples, and links to external documentation, which supports basic use. Points are deducted because it lacks reviewable tool parameters, permission limits, API cost or rate-limit information, compatibility guidance, troubleshooting, and security best practices.
Setup experience 13/20
The README provides npx configuration, the stdio argument, MacOS/Linux and Windows examples, and an environment-variable option for credentials, making the basic mainstream-client path reasonably clear. Points are deducted because runtime and client compatibility are unspecified, the command-line token example is fragile, the relationship between PORT documentation and the manifest's stdio setup is unclear, and there is no evidence of an actual connection check or committed tests.

Static review · not runListed 2026-07-29

Read the FMRS scoring method →

Fit and risk

What it can accessUses the network

Best for

  • Developers using Cursor
  • Teams implementing interfaces from Figma designs
  • AI coding workflows that need layout and styling context

Not for

  • Projects that do not use Figma
  • Workflows that do not use AI coding tools
  • Use cases requiring a documented tool list or a transport other than stdio

Required permissions

  • Requires a Figma Personal Access Token
  • The token is used to access Figma data
  • The source does not specify the token's permission scope

Risks and side effects

  • The server requires a Figma access token, so token exposure could create an access risk
  • Figma design data is supplied to the AI coding agent; sensitive design content should be handled carefully
  • Generated implementations still require human review; the source only states that the server helps improve accuracy

Setup

Before you start

Runtime:Node.js

FIGMA_API_KEY requiredsecret Your Figma Personal Access Token (required, secret) — create one via the instructions in Figma's 'Manage personal access tokens' help article.

Add the server configuration to an MCP client configuration file, run figma-developer-mcp with npx, and replace --figma-api-key=YOUR-KEY with a Figma access token. The server uses stdio transport. FIGMA_API_KEY and PORT may also be set in the client's env field.

.cursor/mcp.json
{"mcpServers":{"Framelink MCP for Figma":{"command":"npx","args":["-y","figma-developer-mcp","--figma-api-key=YOUR-KEY","--stdio"]}}}

Shown for Cursor. Other clients may use a different file or key (VS Code uses "servers") — the configurator below converts it.

.vscode/mcp.json
{
  "servers": {
    "Framelink MCP for Figma": {
      "command": "npx",
      "args": [
        "-y",
        "figma-developer-mcp",
        "--figma-api-key=YOUR-KEY",
        "--stdio"
      ]
    }
  }
}

Goes in your project's .vscode/mcp.json (VS Code uses a "servers" key).

Terminal
claude mcp add 'Framelink MCP for Figma' -- npx -y figma-developer-mcp --figma-api-key=YOUR-KEY --stdio

Run it in a terminal; replace any <…> placeholders with your own values first.

Check that it works

Check that "Framelink MCP for Figma" shows as connected in your client's MCP server list, then paste a Figma file link and ask the agent to read the design — returning layout info confirms the install works.

Troubleshooting

  1. Confirm that a Figma access token has been created and configured
  2. Check the npx command, package name, token argument, and --stdio argument in the client configuration
  3. Confirm that the supplied link points to a Figma file, frame, or group
  4. If using environment variables, check that FIGMA_API_KEY is set

Things to try

Once connected, you can ask your AI assistant things like:

  • Paste this Figma file link and implement the design in Cursor's agent mode
  • Here's a Figma frame link — recreate its layout and styling in my current project's framework
  • Generate the frontend component code for the design at this Figma group link

Use cases

Provide Cursor with a link to a Figma file, frame, or group
Implement Figma designs in any framework
Give AI coding tools layout and styling context

Supported clients

Cursor

Listed from the project's documentation, not tested by this site.

Overview

Framelink MCP for Figma is an MCP server that provides Figma layout information to Cursor and other AI-powered coding tools. It simplifies and translates Figma API responses so models receive more relevant layout and styling context for implementing designs.

Similar servers

Context7 80 · B

Upstash's official server providing up-to-date third-party library docs for AI coding assistants

★ 63.3k · Tools 2 Compare with this →

Source revision c083d65c7e00 Data synced 2026-10-19 Read the FMRS scoring method