Skip to content
AI Dev Toolkit.
Esc
  • AI Token CounterCount tokens for GPT, Claude, Gemini, DeepSeek, Qwen and more.Tool
  • LLM API Cost CalculatorEstimate per-request, daily and monthly API costs.Tool
  • AI Model ComparisonCompare prices, context windows and features across models.Tool
  • AI Model Pricing PagesSpecs, real costs and cheaper alternatives for popular models.Tool
  • Context Window CheckerSee whether your text fits each model’s context window.Tool
  • Subscription vs API CalculatorFind out whether a chat plan or the API is cheaper for you.Tool
  • GPU / VRAM CalculatorCheck how much VRAM a local model needs and which GPUs fit.Tool
  • Prompt Caching CalculatorEstimate savings from prompt caching.Tool

MCP server · Code and developer tools

Figma MCP server

Gives a coding assistant design context from Figma files, such as layout, variables and components, and can write back to the canvas.

Maintainer
Figma (official)
Licence
Not published (hosted service)
Runs
Remote (URL)
Sign-in
OAuth sign-in in the app
Registry version
1.0.3 (updated 2025-10-16)
Last activity
2026-10-13

Overview

What it does

Figma’s remote MCP server at mcp.figma.com passes design information from your Figma files to AI agents that generate code. You add the URL to your client and sign in with your Figma account. Figma also offers plugins for Claude Code and Cursor that bundle the server settings with agent skills. The public figma/mcp-server-guide repository holds setup instructions and skills, not the server code.

Use it when you build interfaces from Figma designs and want the assistant to see the real frames, variables and components rather than a screenshot. Code Connect maps design components to the components in your codebase so generated code reuses them. The remote server can also write to the canvas, creating frames, components, variables and auto layout; Figma says this is free during the beta but will later become a usage-based paid feature. Tools that read data are rate limited by plan and seat.

Tools

What the assistant can do

  • Get design context and code for selected frames (get_design_context)
  • Read variables, metadata and screenshots of nodes
  • Map design components to code with Code Connect
  • Search design system libraries
  • Write to the canvas with use_figma (remote server, beta)
  • Generate Figma designs from web pages (rolling out)
  • Create FigJam diagrams (generate_diagram)

Install

Install Figma MCP server in your app

You need:

  • A Figma account
  • A Dev or Full seat on a Professional, Organisation or Enterprise plan for regular use; Starter plans and View or Collab seats are limited to 6 tool calls a month
  • An MCP client with remote server and OAuth support

Run in your project. --scope local keeps the servers private to you in this project; use user for every project.

Terminal
claude mcp add --scope local --transport http figma https://mcp.figma.com/mcp
  • figma: sign in when the app asks (run /mcp in Claude Code).

Want it alongside other servers? Open Figma MCP server in the MCP config generator and add the rest; it writes one file per app. The snippets follow the setup in the server’s README, checked on 2026-10-14.

Before you install

  • Write tools can create and change frames, components and variables in files you can edit.
  • generate_image spends Figma AI credits. Figma’s guide says agents should ask permission and disclose credit use first.
  • A remote server sees whatever the assistant sends it. Sign in with the narrowest access the service offers. See how to choose a safe server.

Why it’s listed

Why we list it

The vendor’s own bridge between design files and code generation, with Code Connect support that keeps generated code aligned with your components.

Related

All MCP serversMCP config generatorGuide: MCP servers in Claude CodeGuide: what is MCP?