Framelink MCP for Figma
An MCP server that gives the agent simplified Figma layout data from a link so it can build the screen more accurately than from a screenshot
- 16,101 ★ on the repository
- Last commit
- MIT
Extended access
Why this level
- Uses a Figma token with access to your files
- Calls an external API
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add mcp/framelink-mcp-for-figmaDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewExtended accessThe tool runs code or makes network calls and only reads external data.
- Uses a Figma token with access to your files
- Calls an external API
This is third-party code. Review the repository files before installing.
What it does
The server fetches data for a file, frame or group through the Figma API using a link you paste into the agent chat. Before passing it to the model it strips noise and keeps only layout and styling information. Less context helps the agent reproduce the design in code more accurately in any framework. It was built with Cursor in mind but works with any MCP client.
Who it is for. For frontend developers and designers who build interfaces from Figma designs with an agent.
Good fit when
- You need to build a screen or component from a Figma frame link
- Screenshots give inaccurate spacing and sizes
- You lack access to Figma's official Dev Mode MCP
Not a fit when
- You need to edit designs in Figma, the server only reads
- The design does not live in Figma
Example request
Build this screen in React and Tailwind from the design: https://www.figma.com/design/...MCP
- Transport
- stdio
- Authentication
- API key
Environment variables
FIGMA_API_KEYrequired, secret- Figma personal access token, can also be passed via --figma-api-key
PORT- Port when not running in stdio mode
Limitations
Requires a Figma personal access token. Figma and its API are restricted in Russia, so it may not work without a VPN. The server returns simplified data, so complex effects and unusual layers may be lost.
How to disable. Remove the Framelink MCP for Figma entry from the client's MCP config and revoke the token in Figma settings.
FAQ
Where do I get the key?
Create a personal access token in your Figma account settings; the README links to instructions.
Can I avoid putting the key in args?
Yes, the README allows passing FIGMA_API_KEY via the env field.
Discussion
No questions or reviews yet.
Related
MCP serversAn MCP server that lets an agent read and edit Figma designs: colors, typography, components and export
Figma's official MCP server: code from a selected frame, design system variables and components, and writing designs to the canvas
MCP bridge between an agent (Cursor, Claude Code, Codex) and Figma for reading designs and editing them on the canvas
The MCP server of the F2C service: from a Figma node link the agent gets HTML, React or Tailwind markup and local images
A free, two-way Figma MCP server: turns designs into framework-aware code and pushes code back to the canvas
Figma MCP Bridge
figma-mcp-bridge
A Figma Desktop plugin and an MCP server: an agent reads tokens, styles and components without the Figma REST API and its limits. Not from Figma
README in short
The README briefly explains the flow: paste a Figma link into the agent chat and ask it to implement the design. The server simplifies Figma API responses so the model gets only what matters. It gives npx JSON configs for macOS, Linux and Windows, with details on the Framelink site. MIT licensed.