Bidirectional MCP bridge that lets AI draw UI directly on Figma canvas and read designs back as structured data.
figma-ui-mcp is worth checking the docs before setup with strong trust signals. Check agent compatibility and use-case fit before adding it to your workflow.
gh repo view TranHoaiHung/figma-ui-mcp --webOpen the official repository or website.
Check the README for package manager, auth, and platform requirements.
Try it in a small test task inside your agent workflow.
Repository setup guidance
Strong trust signals; still review the README and permissions before production use.
Last commit was about 107 days ago.
206 GitHub stars indicate community interest.
1 open issues signal maintenance load.
MIT license detected.
3 security/trust notes recorded.
Setup difficulty is 3/5.
Extract any website's complete design system with one command.
Generate design system documentation for UI components directly from your AI agent, rendering into Figma or portable .md files.
Argos is an open source visual testing platform that detects unintended UI changes to help teams maintain quality.
A Claude skill to inspect and build Figma design systems with WCAG checks, component scoring, and optional code sync.
This tool connects AI coding assistants like Claude Code or Cursor to Figma. It allows the AI to create and modify UI designs directly on the Figma canvas, and also read existing designs to get structured information like colors, text, and layout. Everything runs locally on your machine, no API key needed.
figma-ui-mcp is a bidirectional MCP (Model Context Protocol) bridge that enables AI assistants (Claude Code, Cursor, Windsurf, Antigravity, VS Code Copilot, or any MCP-compatible IDE) to draw UI directly on Figma canvas and read existing designs back as structured data, screenshots, or code-ready tokens. The tool works entirely over localhost, requiring no Figma API key. It uses a local HTTP server on port 38451 that communicates with a Figma plugin via long polling, ensuring near-realtime latency (<100ms). The bridge supports multiple Figma files/tabs simultaneously via session IDs. Key features include: figma_write to draw frames, shapes, text, and prototypes; figma_read to extract node trees, colors, typography, and screenshots; figma_status to check connection; figma_docs for API reference; figma_rules to generate design system rule sheets; and advanced operations like get_design_context, get_component_map, get_unmapped_components, and get_css. The tool is designed for developers who want to automate UI design generation, extract design tokens, or bridge design and code workflows.
206
Stars
43
Forks
1
Issues
MIT
License
Bidirectional MCP bridge that lets AI draw UI directly on Figma canvas and read designs back as structured data.
Frontend developers who want to generate UI designs from code or natural language., Design engineers who need to bridge design files with codebases., AI/ML developers building tools that interact with design software.
The setup section provides repository-level starting guidance, not a guarantee of an independently verified installation. Check the official README and release notes.
The tool runs a local HTTP server; ensure it is not exposed to the public internet. Figma plugin communicates over localhost; only use on trusted networks.
Similar or complementary options to evaluate include design-extract, uSpec, Argos.
Aug 20, 2026