Figma Console MCP
figma-console-mcp
A two-way Figma MCP server for design systems: reads and writes variables, components and styles and syncs tokens with code
- 2,480 ★ on the repository
- Last commit
- MIT
Broad access
Why this level
- Creates, edits and deletes variables, components and styles in Figma files
- The Figma token opens your files
- Writing needs a plugin in Figma
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add mcp/figma-console-mcpDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewBroad accessThe tool can change data, run commands or handle secrets.
- Creates, edits and deletes variables, components and styles in Figma files
- The Figma token opens your files
- Writing needs a plugin in Figma
This is third-party code. Review the repository files before installing.
What it does
The server works with a design system in both directions. It extracts it from Figma, creates and edits variables, components and styles, renames and deletes tokens, scans a codebase into DTCG tokens and builds a design system package, syncs tokens between Figma and code, takes screenshots, debugs the plugin console, compares a Figma component with code and audits design system health. There are four ways to connect: Remote SSE (read only until the plugin is paired), Cloud Mode (writing through web clients, 96 tools), NPX (recommended) and locally from Git. Writing needs the Desktop Bridge plugin in Figma.
Who it is for. For designers and frontend developers who maintain a design system and want to sync tokens between Figma and code from an agent.
Good fit when
- You need to move tokens from Figma to code in DTCG format and back
- You need to check a design system for mismatches with components in code
- You need to create and edit Figma variables and styles from an agent
Not a fit when
- You only need to read mockups: a Figma server without writing is enough
- You are not ready to let an agent rename and delete tokens in Figma files
Example request
Compare the color variables in Figma with the tokens in the repository and show the mismatches without changing anythingMCP
- Transport
- stdio
- Authentication
- API key
Environment variables
FIGMA_ACCESS_TOKENrequired, secret- Figma access token for the NPX mode
ENABLE_MCP_APPS- Turns on MCP apps
Limitations
The server writes to Figma: it creates and edits variables, components and styles and renames and deletes tokens, so work in a copy of the file. Writing needs the Desktop Bridge plugin. The Remote SSE mode is read only until the plugin is paired. NPX requires the `FIGMA_ACCESS_TOKEN` token. Version 1.40.9 from 02.10.2026. The catalog has another Figma server (figma-mcp-server), which is built differently.
How to disable. Remove the figma-console entry from the client config (claude mcp remove figma-console), remove the Desktop Bridge plugin in Figma and revoke the Figma access token.
FAQ
How is it different from other Figma servers?
It targets design systems and works both ways: it not only reads but writes variables, components and styles and syncs tokens with code.
Which ways to connect exist?
Remote SSE, Cloud Mode, NPX (recommended) and locally from Git.
What is needed to write to Figma?
The Desktop Bridge plugin in Figma and the FIGMA_ACCESS_TOKEN token for NPX.
How many tools are there?
96 in Cloud Mode per the README.
Discussion
No questions or reviews yet.
Related
MCP serversFigma's official MCP server: code from a selected frame, design system variables and components, and writing designs to the canvas
A free, two-way Figma MCP server: turns designs into framework-aware code and pushes code back to the canvas
An MCP server that lets an agent read and edit Figma designs: colors, typography, components and export
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
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
MCP bridge between an agent (Cursor, Claude Code, Codex) and Figma for reading designs and editing them on the canvas
README in short
The README describes a Figma server for design systems: extraction, writing variables and components, DTCG tokens, syncing with code, four ways to connect and the Desktop Bridge plugin. The npm package is figma-console-mcp. MIT license.