Figma MCP Server

Servidor MCP de Figma

Un servidor MCP local con cobertura completa de la API REST de Figma. Funciona con Claude Desktop, Cursor, VS Code, la CLI de Gemini y cualquier cliente MCP. Disponible en npm y en el Registro MCP oficial.

Cómo funciona

Cada endpoint REST de Figma se expone como una herramienta MCP autodescriptiva, descubierta automáticamente al inicio desde tools/figma/, por lo que agregar un endpoint es simplemente agregar un archivo. Los parámetros obligatorios se validan antes de cada llamada. Se ejecuta a través de stdio.

Requisitos previos

Requiere Bun ≥ 1.2. Es nativo de Bun, así que ejecútalo con bunx, no con npx (Node no es compatible).

Clave de API de Figma

Crea un token de acceso personal en Figma en Configuración > Seguridad > Tokens de acceso personal > Generar nuevo token. Proporciónalo como FIGMA_API_KEY, idealmente en el bloque env de la configuración de tu cliente (ver más abajo).

Configura tu cliente

Todos los clientes usan el mismo servidor. Apunta command a bunx, o a su ruta absoluta (which bunx) si el cliente no puede encontrarlo en PATH.

{
  "mcpServers": {
    "figma": {
      "command": "bunx",
      "args": ["figma-mcp-server"],
      "env": {
        "FIGMA_API_KEY": "your_figma_api_key_here"
      }
    }
  }
}

Ubicaciones de archivos de configuración:

• Claude Desktop: Configuración > Desarrollador > Editar configuración (claude_desktop_config.json)
• Cursor: ~/.cursor/mcp.json, o .cursor/mcp.json por proyecto
• CLI de Gemini: ~/.gemini/settings.json

Reinicia el cliente después de editar su configuración.

VS Code

Usa .vscode/mcp.json (espacio de trabajo) o tu mcp.json de usuario, con una clave servers. En lugar de codificar el token, define una entrada para que VS Code lo solicite de forma segura:

{
  "inputs": [
    {
      "type": "promptString",
      "id": "figma-api-key",
      "description": "Figma API Key",
      "password": true
    }
  ],
  "servers": {
    "figma": {
      "command": "bunx",
      "args": ["figma-mcp-server"],
      "env": {
        "FIGMA_API_KEY": "${input:figma-api-key}"
      }
    }
  }
}

• Con ${input:figma-api-key}, VS Code te solicita la clave la primera vez que se inicia el servidor y luego la almacena en el almacenamiento secreto de tu sistema operativo.
• Para volver a ingresarla o borrarla: Paleta de comandos → MCP: Listar servidores → elige el servidor → restablece/edita sus entradas.

Cobertura de herramientas

Cobertura completa de la API REST de Figma (endpoints no obsoletos), 50 herramientas en:

• Archivos y nodos (archivos, árboles de nodos, renderizado de imágenes, rellenos de imágenes, metadatos, historial de versiones)
• Variables / tokens de diseño (lectura, publicación, modificación masiva)
• Componentes, conjuntos de componentes y estilos (ámbitos de archivo, publicados y de equipo)
• Comentarios y reacciones
• Carpetas (carpetas de nivel superior, subcarpetas, archivos, metadatos)
• Usuarios
• Recursos de desarrollo
• Webhooks (v2)
• Analíticas de biblioteca (acciones y usos de componentes, estilos y variables)
• Organización: registros de actividad, registros de desarrollador, uso de IA (Enterprise)
• Incrustaciones y pagos

Consulta la lista de herramientas de tu cliente MCP para obtener la lista completa y siempre actualizada de nombres de herramientas y parámetros.

Requisitos de plan

La mayoría de las herramientas funcionan con el token de acceso personal de cualquier plan. Estas requieren niveles superiores:

• Variables (list_file_variables, get_published_variables, modify_variables): organización Enterprise.
• Analíticas de biblioteca (get_library_*): plan Organization o Enterprise.
• Registros de actividad, registros de desarrollador, uso de IA: organización Enterprise con un token de acceso de administrador o de plan.

---

Licencia MIT · Por @planetabhi ⋛⋋( ⊙◊⊙)⋌⋚