Turn Figma designs into code with an AI assistant
Design servers let a coding assistant look at the design instead of a screenshot of it. A Figma MCP server can read a frame's layout, text, colors, spacing, and component structure, then the model writes UI code that follows the real values. Designers also use these servers to rename layers, audit a file for inconsistent styles, or pull design tokens into a theme. Accuracy improves a lot when the file uses components and auto layout. Most servers need a personal access token, and Figma's own Dev Mode server runs locally from the desktop app.
Example prompts
Paste one into Claude, Cursor, or any MCP client once a matching server is installed.
Build this Figma frame as a React component with Tailwind classes.
List the colors and text styles used in this file and flag near-duplicates.
Export the spacing and color tokens from the design system page as CSS variables.
MCP servers for Figma design
The 12 strongest of 841 matching servers. Servers that name the topic directly come first.
- 67Trust score 67 of 100, Good
Write to a live Figma canvas, get a screenshot back, and roll back mistakes. Zero deps, free plan.
Registry - 66Trust score 66 of 100, Good
Figma CodeKit MCP
by mehmoodqureshi · JavaScript
Figma to pixel-perfect code: deterministic HTML/React, then a render + pixel-diff verify loop.
Registry - 60Trust score 60 of 100, Good
Author Rive; convert Lottie, After Effects, Animate and Figma into it; animate AI and pixel art.
Registry - 55Trust score 55 of 100, Fair
figma-mcp-bridge
by kolganovr · JavaScript
Write to a live Figma canvas, get a screenshot back, and roll back mistakes. Zero deps, free plan.
RegistryDeprecated
55Trust score 55 of 100, FairCompares a mobile app screen (Android or iOS Simulator) with its Figma design and suggests fixes.
Registry- 55Trust score 55 of 100, Fair
MCP server that reads local Figma .fig files, fully offline
Registry - 55Trust score 55 of 100, Fair
Figma MCP server with full read/write access via plugin bridge — no API token or rate limits.
Registry - 55Trust score 55 of 100, Fair
Bidirectional Figma MCP — AI draws UI on Figma canvas, reads designs back
Registry - 55Trust score 55 of 100, Fair
Figma designs pulled once into a local vault; AI agents read them offline with no rate limits
Registry - 55Trust score 55 of 100, Fair
Let agents manage your Figma workspace. 102 tools for seats, teams, offboarding, and cleanup.
Registry
55Trust score 55 of 100, Fairlayernote
Unknown author
Client feedback pinned on live sites, Figma frames, PDFs, images and video, for Claude and agents.
RegistryRemote- 52Trust score 52 of 100, Fair
Canva MCP
Unknown author
Create, search, edit, and export designs and assets from Canva.
RegistryRemote
How to set it up
- Pick a server. mokido is the strongest match. Check its tools and the API keys it needs on its page.
- Copy the config for your client. Open the install guide for Claude Desktop, Claude Code, Cursor, or VS Code, and paste the generated block into the client's config file. The client guides show where each config file lives.
- Restart and try a prompt. Restart the client so it loads the server, then paste one of the example prompts above.
Questions about Figma design
What is the best MCP server for Figma design?
mokido ranks first here with a trust score of 67/100, followed by Figma CodeKit MCP (66) and Polymation (60). Servers that name the topic directly come first, each group ordered by the public trust score, which nobody can pay for. See the methodology for how it is calculated.
How do I set up mokido in Claude or Cursor?
Open the install guide for Claude Desktop or Cursor, copy the generated config into the client's config file, add any API keys the server asks for, then restart the client. The client guides cover VS Code, Claude Code, Windsurf, and more.
Can I use a hosted server instead of installing one locally?
2 of the 12 servers listed here can connect remotely over HTTP, so there is nothing to run on your machine: layernote, Canva MCP. The rest run locally over stdio.
How many MCP servers can do this?
MCPpedia lists 841 published servers that match this use case. This page shows the 12 strongest matches; thin and duplicate listings are left out.