Servidor MCP de Figma

Un servidor ModelContextProtocol que permite a los asistentes de IA interactuar con archivos de Figma. Este servidor proporciona herramientas para ver, comentar y analizar diseños de Figma directamente a través de ModelContextProtocol.

Características

Añade un archivo Figma a tu chat con Claude proporcionando la URL
Leer y publicar comentarios sobre los archivos de Figma

Configuración con Claude

Descargue e instale la aplicación de escritorio Claude desde claude.ai/download
Obtén una clave API de Figma (figma.com -> haz clic en tu nombre en la esquina superior izquierda -> Configuración -> Seguridad). Otorga permisos File content y Comments .
Configura a Claude para que use el servidor MCP de Figma. Si este es tu primer servidor MCP, ejecuta lo siguiente en la terminal.

echo '{
  "mcpServers": {
    "figma-mcp": {
      "command": "npx",
      "args": ["figma-mcp"],
      "env": {
        "FIGMA_API_KEY": "<YOUR_API_KEY>"
      }
    }
  }
}' > ~/Library/Application\ Support/Claude/claude_desktop_config.json

Si no es así, copia el bloque figma-mcp a tu claude_desktop_config.json

Reinicie Claude Desktop.
Busque el ícono del martillo con el número de herramientas disponibles en la interfaz de Claude para confirmar que el servidor está funcionando.

Ejemplo de uso

Inicie un nuevo chat con Claude Desktop y pegue lo siguiente

What's in this figma file?

https://www.figma.com/design/MLkM98c1s4A9o9CMnHEyEC

Demostración de un uso más realista

https://www.loom.com/share/0e759622e05e4ab1819325bcf6128945?sid=bcf6125b-b5de-4098-bf81-baff157e3dc3

Configuración de desarrollo

Corriendo con Inspector

Para fines de desarrollo y depuración, puede utilizar la herramienta Inspector de MCP. El Inspector proporciona una interfaz visual para probar y supervisar las interacciones con el servidor MCP.

Visita la documentación del Inspector para obtener instrucciones de configuración detalladas y pautas de uso.

El comando para probar localmente con Inspector es

npx @modelcontextprotocol/inspector npx figma-mcp

Desarrollo local

Clonar el repositorio
Instalar dependencias:

npm install

Construir el proyecto:

npm run build

Para desarrollo con reconstrucción automática:

npm run watch

Herramientas disponibles

El servidor proporciona las siguientes herramientas:

add_figma_file : agrega un archivo Figma a tu contexto proporcionando su URL
view_node : obtiene una miniatura de un nodo específico en un archivo Figma
read_comments : Obtener todos los comentarios en un archivo Figma
post_comment : Publica un comentario en un nodo en un archivo Figma
reply_to_comment : Responder a un comentario existente en un archivo Figma

Cada herramienta está diseñada para proporcionar una funcionalidad específica para interactuar con archivos Figma a través de la interfaz ModelContextProtocol.

You must be authenticated.

security – no known vulnerabilities

license - not found

quality - confirmed to work

remote-capable server

The server can be hosted and run remotely because it primarily relies on remote services or has no dependency on the local environment.

Tools

Permite que los asistentes de IA interactúen con archivos de Figma a través del ModelContextProtocol, lo que permite ver, comentar y analizar diseños de Figma directamente en las interfaces de chat.

Related Resources

Reddit Discussion about this server

Related MCP Servers

figma-mcp
JayZeeDesign
A
security
A
license
A
quality
Allow your AI coding agents to access Figma files & prototypes directly. You can DM me for any issues / improvements: https://x.com/jasonzhou1993 1. Access all figma pages 2. Access all figma components 3. Access figma prototype flows
Last updated -
3
49
Python
MIT License
mcp-figma
smithery-ai
A
security
F
license
A
quality
A Model Context Protocol server that provides access to Figma API functionality, allowing AI assistants like Claude to interact with Figma files, comments, components, and team resources.
Last updated -
18
34
1
Figma MCP Server
1yhy
-
security
A
license
-
quality
A Model Context Protocol server that integrates Figma design files with AI coding tools like Cursor, Windsurf, and Cline, allowing AI tools to access and understand Figma design data for generating more accurate code.
Last updated -
124
6
TypeScript
MIT License
Figma MCP Server
xxflux
A
security
F
license
A
quality
A TypeScript server that implements the Model Context Protocol, enabling AI-powered design creation in Figma using natural language prompts through Cursor Agent.
Last updated -
5
997
2
JavaScript

View all related MCP servers

Figma MCP Server