Figma MCP Server
Provides tools to retrieve and interact with Figma design file data, including nodes, styles, and components.
Allows Gemini CLI to interact with Figma files, retrieving design information programmatically.
Click on "Install Server".
Wait a few minutes for the server to deploy. Once ready, it will show a "Started" state.
In the chat, type
@followed by the MCP server name and your instructions, e.g., "@Figma MCP Serverget the design nodes and properties from my Figma file"
That's it! The server will respond to your query, and you can continue using it as needed.
Here is a step-by-step guide with screenshots.
Figma MCP Server
A local MCP server with full Figma REST API coverage. Works with Claude Desktop, Cursor, VS Code, the Gemini CLI, and any MCP client. Available on npm and the official MCP Registry.
How it works
Each Figma REST endpoint is exposed as one self-describing MCP tool, auto-discovered at startup from tools/figma/, so adding an endpoint is just adding a file. Required parameters are validated before each call. It runs over stdio.
Prerequisites
Requires Bun ≥ 1.2 — it's Bun-native, so launch it with bunx, not npx (Node isn't supported).
Related MCP server: Claude Talk to Figma MCP
Figma API key
Create a personal access token in Figma under Settings > Security > Personal access tokens > Generate new token. Provide it as FIGMA_API_KEY, ideally in your client config's env block (see below).
Configure your client
Every client uses the same server. Point command at bunx, or its absolute path (which bunx) if the client cannot find it on PATH.
{
"mcpServers": {
"figma": {
"command": "bunx",
"args": ["figma-mcp-server"],
"env": {
"FIGMA_API_KEY": "your_figma_api_key_here"
}
}
}
}Config file locations:
Claude Desktop: Settings > Developer > Edit Config (
claude_desktop_config.json)Cursor:
~/.cursor/mcp.json, or.cursor/mcp.jsonper projectGemini CLI:
~/.gemini/settings.json
Restart the client after editing its config.
VS Code
Use .vscode/mcp.json (workspace) or your user mcp.json, with a servers key. Instead of hardcoding the token, define an input so VS Code prompts for it securely:
{
"inputs": [
{
"type": "promptString",
"id": "figma-api-key",
"description": "Figma API Key",
"password": true
}
],
"servers": {
"figma": {
"command": "bunx",
"args": ["figma-mcp-server"],
"env": {
"FIGMA_API_KEY": "${input:figma-api-key}"
}
}
}
}With
${input:figma-api-key}, VS Code prompts you for the key the first time the server starts, then stores it in your OS secret storage.To re-enter or clear it: Command Palette → MCP: List Servers → pick the server → reset/edit its inputs.
Tool coverage
Full coverage of the Figma REST API (non-deprecated endpoints), 49 tools across:
Files and nodes (files, node trees, image rendering, image fills, metadata, version history)
Variables / design tokens (read, published, bulk modify)
Components, component sets, and styles (file, published, and team scopes)
Comments and reactions
Projects and users
Dev resources
Webhooks (v2)
Library analytics (component, style, and variable actions and usages)
Organization: activity logs, developer logs, AI usage (Enterprise)
Embeds and payments
Check your MCP client's tool list for the full, always-current list of tool names and parameters.
Plan requirements
Most tools work with any plan's personal access token. These need higher tiers:
Variables (
list_file_variables,get_published_variables,modify_variables): Enterprise organization.Library analytics (
get_library_*): Organization or Enterprise plan.Activity logs, developer logs, AI usage: Enterprise organization with an admin or plan access token.
MIT License · By @planetabhi ⋛⋋( ⊙◊⊙)⋌⋚
This server cannot be installed
Maintenance
Resources
Unclaimed servers have limited discoverability.
Looking for Admin?
If you are the server author, to access and configure the admin panel.
Related MCP Servers
- Alicense-qualityDmaintenanceGives AI-powered coding tools like Cursor, Windsurf, and Cline access to Figma design files, enabling more accurate code generation directly from Figma designs.94,922MIT
- AlicenseCqualityCmaintenanceEnables Claude Desktop and other AI tools to interact directly with Figma, allowing for powerful AI-assisted design capabilities through natural language commands.92581648MIT
- Alicense-qualityDmaintenanceEnables AI assistants like Claude Desktop to interact directly with Figma, allowing natural language commands to create, modify, and analyze designs including shapes, text, components, and layouts in real-time.MIT
- Alicense-qualityDmaintenanceEnables AI assistants to interact with Figma designs using natural language commands, supporting file analysis, component extraction, asset export, comment management, and design system queries through the Figma API.2,2351ISC
Related MCP Connectors
Connect AI assistants to your GitHub-hosted Obsidian vault to seamlessly access, search, and analy…
Connect AI coding agents to Anima Playground, Figma, and your design system.
Sync Lightroom, Figma, Dropbox & Canva assets to WordPress and Shopify via natural language.
Latest Blog Posts
- Who's Calling? MCP Hosts Are an Identity Blind Spot (And the Spec Knows It)By Om-Shree-0709 on .mcpAgent IdentityOAuth 2.1
- Your AI Chatbot Just Exposed Your CEO's Salary to an InternBy Om-Shree-0709 on .Agent IdentityMCP SecurityOAuth Delegation
- Why MCP Servers Need Execution Sandboxing (And Why Your Current Stack Isn't Enough)By Om-Shree-0709 on .Agentic AiPrompt InjectionWebAssembly
MCP directory API
We provide all the information about MCP servers via our MCP API.
curl -X GET 'https://glama.ai/api/mcp/v1/servers/planetabhi/figma-mcp-server'
If you have feedback or need assistance with the MCP directory API, please join our Discord server