figma-console-mcp-design-system-api
Figma Console MCP Design System API
Skill by ara.so — Design Skills collection.
What is Figma Console MCP?
Figma Console MCP is a Model Context Protocol server that bridges AI assistants with Figma, providing 103 tools for design system extraction, component creation, bidirectional token synchronization, and visual debugging. It enables AI to read, create, and modify Figma designs programmatically.
Key capabilities:
- Design extraction - Pull variables, components, styles, and full design trees
- Bidirectional token sync - Export variables to DTCG JSON + CSS, push edits back to Figma
- Component creation - Create frames, shapes, text, and instantiate components
- Variable management - Create, update, rename, delete design tokens
- Visual debugging - Screenshot nodes, scan accessibility, diff versions
- FigJam & Slides - Create stickies, flowcharts, presentations
- Real-time monitoring - Watch console logs and selection changes (Desktop Bridge)
Installation
More from aradotso/design-skills
open-design-ai-prototyping
Local-first AI design tool that turns coding agents into design engines with 31 skills, 129 design systems, and multi-format export
69design-md-format
Create and validate DESIGN.md files that give AI coding agents structured understanding of design systems through machine-readable tokens and human-readable rationale.
67open-codesign-ai-design
Use Open CoDesign to generate prototypes, slides, and PDFs from prompts with Claude, GPT, Gemini, or local models
66claude-design-system-hooks
AI-powered design-to-code engine that generates production-ready UI components from natural language using Claude API
63claude-design-ui-framework
AI UI/UX framework for building Claude-powered apps with React, Tailwind, screenshot-to-code, and Artifacts-style components
62keychron-hardware-design
Access and work with Keychron keyboard and mouse industrial design files (STEP, DXF, DWG, PDF) for 135+ models to create compatible accessories, remixes, and modifications.
60