BACK TO MCP SERVERS
designclaude-codecursorclinewindsurf
Figma Context MCP Server
Gives coding agents direct access to Figma component structures, tokens, and layouts for accurate UI implementation.
What it does
Connects AI coding agents to Figma's API to extract node hierarchies, CSS styles, spacing rules, and layout properties. Allows agents to convert designs into frontend code without manual token transcription.
Maintained by GLips.
Setup
npx -y figma-context-mcp
For Cursor ~/.cursor/mcp.json:
{
"mcpServers": {
"figma-context": {
"command": "npx",
"args": ["-y", "figma-context-mcp"],
"env": {
"FIGMA_ACCESS_TOKEN": "YOUR_FIGMA_PAT"
}
}
}
}What to watch out for
Requires a Personal Access Token (FIGMA_ACCESS_TOKEN) generated from your Figma account settings. Ensure designs use Figma Auto Layout for cleanest generated layout code.