Allows AI coding agents to access Figma files and prototypes directly, providing capabilities to retrieve components, specific nodes, and workflow connections from Figma designs using the Figma API.
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-mcpshow me all components in the design system 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 Python
Allow your AI coding agents to access Figma files & prototypes directly. You can DM me for any issues / improvements: https://x.com/jasonzhou1993
Quick Installation with pipx
pipx install figma-mcpFor Cursor:
In settings, add an MCP server using the command:
figma-mcp --figma-api-key=your_figma_keyOR Add a
.cursor/mcp.jsonfile in your project:
{
"mcpServers": {
"figma-python": {
"command": "figma-mcp",
"args": [
"--figma-api-key=your_figma_key"
]
}
}
}For other IDEs like Windsurf, use an MCP configuration file (e.g., mcp_config.json):
{
"mcpServers": {
"figma-python": {
"command": "figma-mcp",
"args": [
"--figma-api-key=your_figma_key"
]
}
}
}Related MCP server: Figma MCP Server
Install uv and set up the environment
curl -LsSf https://astral.sh/uv/install.sh | sh
uv venv
source .venv/bin/activate
uv syncTest locally
python -m figma_mcp.main