デザイン
cursor-talk-to-figma-mcp
TalkToFigma — an MCP bridge letting Cursor, Claude Code or Codex read and modify Figma designs.
★ 7.0k スターMIT
ガイドを見る →figma-console-mcpは、southleftが公開しているオープンソースのデザインプロジェクトです（GitHub: southleft/figma-console-mcp）。GitHubスターは2,453、フォークは255で、MITライセンスの下で公開されています。GitHubでの最終更新は2026年10月2日です。
Your design system as an API — an MCP server that connects AI to Figma for extraction, creation and debugging
Decide your mode: full creation/editing (NPX setup, 121 tools), web AI clients (Cloud Mode, 96 tools) or read-only exploration (Remote SSE).
Create a personal access token in Figma with File content, File versions, Variables and Comments scopes.
Add the npx figma-console-mcp server with FIGMA_ACCESS_TOKEN to Claude Code, Cursor, Windsurf or Claude Desktop (or use the claude mcp add one-liner).
Open Figma Desktop, import and run the Desktop Bridge plugin from the auto-created manifest path, restart your client, and ask it to check Figma status or create a frame.
Pull variables, components and styles as exact tokens, variants, bindings and states — structured data, not framework opinions.
Export Figma variables to DTCG JSON (plus 9 more formats) and push code-side edits back into Figma with full apply — replacing a Style Dictionary/Tokens Studio export pipeline.
Create UI components, frames and layouts directly in Figma, including one-call component-set creation from a variant matrix, in NPX/Cloud modes.
Design-code parity comparisons, 14 WCAG accessibility checks with conformance tagging, axe-core code scanning, and scored design-system health audits.
List versions, diff snapshots, generate markdown changelogs and trace when a property or variant was introduced.
Scan a production codebase, mine its de-facto styling into DTCG tokens with provenance, scaffold a design-system package with a wired Storybook, and round-trip tokens into Figma (Local Mode).
Clone Figma Console MCP for the Local Git/contributor setup; most users use npx in step 2.
git clone https://github.com/southleft/figma-console-mcp.git
cd figma-console-mcpFor Claude Code, the README's one-liner registers the server with your token; other clients use the npx figma-console-mcp@latest config.
claude mcp add figma-console -s user -e FIGMA_ACCESS_TOKEN=figd_YOUR_TOKENIn Figma Desktop: Plugins → Development → Import plugin from manifest, select ~/.figma-console-mcp/plugin/manifest.json, run the plugin, restart your MCP client, and ask 'Check Figma status'.
# see README for the exact command — plugin manifest path is auto-created by the serversouthleft maintains it; documentation is at docs.figma-console-mcp.southleft.com.
The server is MIT-licensed and free. You need a Figma account and personal access token; Figma's own plan limits apply to your files.
It needs a free Figma personal access token (not a paid API key). Your AI client (Claude etc.) has its own plan or key.
This is an independent, design-system-focused server emphasizing bidirectional token sync, deterministic parity/accessibility/health checks and codebase-to-design-system extraction; check its docs for the current tool-by-tool comparison with your needs.
Create a Figma token, add the npx server to your MCP client, import the Desktop Bridge plugin in Figma Desktop, restart the client, and test with 'Check Figma status'.
TalkToFigma — an MCP bridge letting Cursor, Claude Code or Codex read and modify Figma designs.
Extract any website's design system — logo, colours, typography and tokens — in one command.
Figma plugin that turns your style guide into DESIGN.md and SKILL.md for AI
Connect AI coding assistants to Unity or Godot with 275+ tools
Desktop MCP client that unifies AI tools across vendors
Open-source online poster and image designer with a full editor, admin backend, and built-in AI tools
LibreAIカタログに掲載されたデザインプロジェクトの中で最もスターの多いもの — figma-console-mcpが合わなかった場合に検討したい、現実的な候補リストです。
Excalidraw — the virtual whiteboard with the hand-drawn look: infinite canvas, real-time collaboration and end-to-end encrypted sharing, MIT-licensed
Drop in a screenshot and convert it to clean code (HTML/Tailwind/React/Vue)
Turn any idea, plan or codebase into a beautiful interactive architecture diagram — an agent skill
There can be more than Notion and Miro. AFFiNE(pronounced [ə‘fain]) is a next-gen knowledge base that brings planning, sorting and creating all together. Pri…
draw.io Desktop — the official offline desktop app for diagrams.net: flowcharts, architecture diagrams and wireframes in an Electron app that never sends your diagram data anywhere, GPL-3.0
カタログの中でfigma-console-mcpとスター数が近いデザインプロジェクト — 前後の棚もそのまま見て回れます。
open-source canvas for thoughtful software design
PaperBanana — agentic generation of publication-quality academic figures, diagrams and plots from text
DingTalk Workspace is an officially open-sourced cross-platform CLI tool from DingTalk. It unifies DingTalk’s full suite of product capabilities into a singl…
Diagram as Code Tool Written in Rust with Draggable Editing
Open-source data modeling tool designed for PostgreSQL. No more typing DDL commands. Let pgModeler do the work for you!
Diagram-as-code for AWS architecture.