Config is the same across clients — only the file and path differ.
{
"mcpServers": {
"figma": {
"args": [
"-y",
"figma-ui-mcp"
],
"command": "npx"
}
}
}Are you the author?
Add this badge to your README to show your security score and help users find safe servers.
Bidirectional Figma MCP — AI draws UI on Figma canvas, reads designs back
Run this in your terminal to verify the server starts. Then let us know if it worked — your result helps other developers.
npx -y 'figma-ui-mcp' 2>&1 | head -1 && echo "✓ Server started successfully"
After testing, let us know if it worked:
Five weighted categories — click any category to see the underlying evidence.
No known CVEs.
Checked figma-ui-mcp against OSV.dev.
This server is missing a description. Tools and install config are also missing.If you've used it, help the community.
Add informationBe the first to review
Have you used this server?
Share your experience — it helps other developers decide.
Sign in to write a review.
Others in design
MCP server for accessing Figma plugin console logs and screenshots via Cloudflare Workers or local mode
Official Miro MCP server - Supports context to code and creating diagrams, docs, and data tables.
AI image generation and editing with prompt optimization and quality presets. Powered by Nano Banana
Coinbase Design System - MCP Server
MCP Security Weekly
Get CVE alerts and security updates for io.github.TranHoaiHung/figma-ui-mcp and similar servers.
Start a conversation
Ask a question, share a tip, or report an issue.
Sign in to join the discussion.
Claude Code to Figma · Antigravity to Figma · Cursor to Figma · Any MCP IDE to Figma
✅ Tested: Claude Code, Antigravity | 🔧 Compatible: Cursor, VS Code, Windsurf, Zed (any MCP stdio client)
Bidirectional Figma MCP bridge — let AI assistants (Claude Code, Cursor, Windsurf, Antigravity, VS Code Copilot, or any MCP-compatible IDE) draw UI directly on Figma canvas and read existing designs back as structured data, screenshots, or code-ready tokens. No Figma API key needed — works entirely over localhost.
Requires Figma Desktop — the plugin communicates with the MCP server over
localhostHTTP polling. Figma's web app does not allow localhost network access, so Figma Desktop is required.
Claude ──figma_write──▶ MCP Server ──HTTP (localhost:38451)──▶ Figma Plugin ──▶ Figma Document
Claude ◀─figma_read──── MCP Server ◀──HTTP (localhost:38451)── Figma Plugin ◀── Figma Document
The MCP server starts a small HTTP server bound to localhost:38451. The Figma plugin (running inside Figma Desktop) uses long polling — the server holds requests up to 8s until work arrives, flushing immediately when new ops are queued (near-realtime latency <100ms). All traffic stays on your machine — nothing is sent to any external server.
Multi-instance support (v2.3.0+): Multiple Figma files/tabs can connect simultaneously. Each plugin instance sends a sessionId, and the bridge routes operations to the correct session. Use the optional sessionId param in figma_write/figma_read to target a specific file.
| Direction | Tool | What it does |
|---|---|---|
| Write | figma_write | Draw frames, shapes, text, prototypes via JS code |
| Read | figma_read | Extract node trees, colors, typography, screenshots |
| Info | figma_status | Check plugin connection + active sessions |
| Docs | figma_docs | Get full API reference + examples |
| Rules | figma_rules | Generate design system rule sheet — tokens, typography, components |
| Feature | Description |
|---|---|
get_design_context | AI-optimized payload for a node — flex layout, token-resolved colors (var(--name)), typography with style names, component instances with variant properties. Best single call for design→React/Vue/Swift code. |
get_component_map | List every component instance in a frame with componentSetName, variantLabel, properties, and suggestedImport path. Scaffold import statements in one call. |
get_unmapped_components | Find component instances that have no description in Figma (no code mapping yet). Prompts AI to ask user for correct import paths. |
figma_rules tool | New top-level MCP tool — aggregates color tokens, typography styles, variables (all modes), and component catalog into a single markdown rule sheet. Equivalent to official Figma MCP's create_design_system_rules. Call once at session start. |
get_css operation | figma_read get_css { nodeId } → ready-to-use CSS string ( |