# Framelink Figma MCP (MCP Server)

> Give coding agents simplified Figma layout and styling data

- Type: MCP server
- Publisher: Framelink
- Categories: Design, Development
- Website: https://github.com/GLips/Figma-Context-MCP
- Docs: https://www.framelink.ai/docs/quickstart
- Source: https://github.com/GLips/Figma-Context-MCP
- Transport: stdio
- Launch command: npx -y figma-developer-mcp --figma-api-key=YOUR-KEY --stdio
- Sign-in: api-key
- Environment variables: FIGMA_API_KEY
- GitHub stars: 15943
- Listed: 2025-02-13

## About

Framelink's Figma Context MCP server fetches Figma file data via the Figma API and simplifies it to the layout and styling information most relevant for implementing designs. Designed for Cursor and other AI coding tools; requires a Figma personal access token.

## Install

1. **Add the server to Codex**

   Codex CLI:

   ```bash
   codex mcp add figma-context --env FIGMA_API_KEY=YOUR_FIGMA_API_KEY -- npx -y figma-developer-mcp --figma-api-key=YOUR-KEY --stdio
   ```

   config.toml:

   ```toml
   [mcp_servers.figma-context]
   command = "npx"
   args = ["-y", "figma-developer-mcp", "--figma-api-key=YOUR-KEY", "--stdio"]
   
   [mcp_servers.figma-context.env]
   FIGMA_API_KEY = "YOUR_FIGMA_API_KEY"
   ```

   Agents SDK:

   ```python
   from agents import Agent, Runner
   from agents.mcp import MCPServerStdio
   
   async with MCPServerStdio(
       name="Framelink Figma MCP",
       params={"command": "npx", "args": ["-y", "figma-developer-mcp", "--figma-api-key=YOUR-KEY", "--stdio"]},
   ) as server:
       agent = Agent(name="Assistant", mcp_servers=[server])
       result = await Runner.run(agent, "Implement this Figma frame as a React component: <figma link>")
       print(result.final_output)
   ```

## Tools

- `get_figma_data`
- `download_figma_images`

## Example prompts

- "Implement this Figma frame as a React component: <figma link>"
- "Download the icons from this Figma file"
- "What spacing and colors does this Figma design use?"

## Related

- [Chrome DevTools MCP](https://chatgptplugins.directory/mcp/chrome-devtools.md): Let coding agents control and debug a live Chrome browser
- [Playwright MCP](https://chatgptplugins.directory/mcp/playwright.md): Browser automation for agents via Playwright accessibility snapshots
- [GitHub](https://chatgptplugins.directory/mcp/github.md): Manage repos, issues, pull requests and Actions from your AI agent
- [Context7](https://chatgptplugins.directory/mcp/context7.md): Pull up-to-date, version-specific library docs into your coding agent
- [Excalidraw](https://chatgptplugins.directory/mcp/excalidraw.md): Draw hand-drawn Excalidraw diagrams live inside ChatGPT, Claude and VS Code
- [Supabase](https://chatgptplugins.directory/mcp/supabase.md): Manage Supabase databases, migrations, edge functions and logs

---
Source: https://chatgptplugins.directory/mcp/figma-context · Index: https://chatgptplugins.directory/llms.txt · Independent and community-run. Not affiliated with or endorsed by OpenAI. ChatGPT is a trademark of OpenAI.