🎨

Figma MCP Server

by Figma

Connect to Figma files, extract design specifications, retrieve component properties, and sync design tokens. Brings Figma directly into developer workflow for design-informed code generation. Available as remote hosted server or local via Figma desktop app.

Official

Company Integration

GitHub Docs Website

Deployment Type

🔄Local & Remote

Supports both local and remote

Authentication

🔑API Key

Requires API key

Installation

Easy

Quick setup, minimal config

Use Cases

Common ways to use this MCP server

Design handoff

Token extraction

Component documentation

Design system sync

Ideal For

This server is perfect for these roles and teams

Product Managers

Designers

Frontend Developers

Design System Teams

Installation

Quick start guide for setting up this MCP server

1. Install via npx

npx -y figma-developer-mcp

2. Add to Claude Desktop config

Edit claude_desktop_config.json

{
  "mcpServers": {
    "figma": {
      "command": "npx",
      "args": ["-y", "figma-developer-mcp"],
      "env": {
        "API_KEY": "your-api-key-here"
      }
    }
  }
}