
Figma Console MCP
Interface UIpar southleft
Pont entre l'IA et Figma pour l'extraction, la création, le débogage et l'analyse d'accessibilité — avec navigateur de tokens interactif et tableau de bord du système de design.
Ce qu'il fait
Figma Console MCP rend deux expériences d'interface utilisateur interactives à l'intérieur des clients MCP : un Navigateur de Tokens pour explorer les tokens de design avec des échantillons de couleurs, la résolution d'alias et des colonnes de mode par collection (Clair, Sombre, Personnalisé), et un Tableau de bord du Système de Design qui audite votre système de design à travers six catégories (Nommage, Tokens, Composants, Accessibilité, Cohérence, Couverture) avec un score de type Lighthouse. Au-delà des applications UI, il expose plus de 94 outils permettant aux assistants IA de lire et d'écrire des fichiers Figma — extraction de variables, création de composants, gestion des tokens de design, construction de tableaux FigJam, édition de Figma Slides et exécution de scans d'accessibilité WCAG.
Fonctionnalités clés
- Navigateur de Tokens Interactif — Parcourez tous les tokens de design organisés par collection avec des sections extensibles, filtres par type, colonnes de mode par collection, échantillons de couleurs et copie des valeurs en un clic.
- Tableau de bord du Système de Design — Score de santé de type Lighthouse auditant le nommage, les tokens, les composants, l'accessibilité, la cohérence et la couverture, avec des conclusions extensibles et des indicateurs de sévérité.
- 94+ Outils MCP — Accès complet en lecture/écriture à Figma : extraction de variables, création de composants, gestion des tokens de design, construction de tableaux FigJam avec post-its/organigrammes/tableaux, et gestion des présentations Figma Slides.
- Relais d'Écriture Cloud — Les clients IA web (Claude.ai, v0, Replit) peuvent créer et modifier des designs Figma via un appairage cloud — aucun Node.js requis.
- Scan d'Accessibilité WCAG — 14 règles de linting côté design, scorecards de composants avec simulation de daltonisme, scan de code axe-core (104 règles), et vérification de la parité design-code.
Installation
Claude Desktop : Ajoutez à claude_desktop_config.json :
{
"mcpServers": {
"figma-console": {
"command": "npx",
"args": ["-y", "figma-console-mcp@latest"],
"env": {
"FIGMA_ACCESS_TOKEN": "figd_VOTRE_TOKEN_ICI",
"ENABLE_MCP_APPS": "true"
}
}
}
}
Claude Code (CLI) :
claude mcp add figma-console -s user -e FIGMA_ACCESS_TOKEN=figd_VOTRE_TOKEN_ICI -e ENABLE_MCP_APPS=true -- npx -y figma-console-mcp@latest
Cursor / Windsurf : Ajoutez à mcp.json ou mcp_config.json :
{
"mcpServers": {
"figma-console": {
"command": "npx",
"args": ["-y", "figma-console-mcp@latest"],
"env": {
"FIGMA_ACCESS_TOKEN": "figd_VOTRE_TOKEN_ICI",
"ENABLE_MCP_APPS": "true"
}
}
}
}
Claude.ai (Mode Cloud) : Ajoutez l'URL du connecteur https://figma-console-mcp.southleft.com/mcp avec votre PAT Figma comme token Bearer.
SSE Distant (Lecture Seule) : Ajoutez l'URL du connecteur https://figma-console-mcp.southleft.com/sse dans les Paramètres de Claude Desktop → Connecteurs.
Hôtes supportés
Claude Desktop, Claude Code, Claude.ai, Cursor, Windsurf, VS Code Copilot.






