Enables AI clients like Claude to bidirectionally interact with Figma, generating UI and extracting design data.
Sponsored
Figma UI MCP acts as a robust bridge, allowing AI clients such as Claude to seamlessly integrate with Figma Desktop. It provides a bidirectional flow where AI can programmatically create, modify, and manage user interfaces directly within Figma using JavaScript code. Conversely, it can read and extract detailed design information—including node trees, colors, typography, and even screenshots—from existing Figma files, enabling AI to analyze, describe, and convert designs into various formats like code. This tool operates securely and locally via an HTTP polling mechanism over localhost, ensuring all data remains on the user's machine.
Key Features
01Programmatic UI generation and modification in Figma via AI-driven JavaScript code.
02Bidirectional communication between AI clients (e.g., Claude, Cursor) and Figma Desktop.
03Extraction of detailed Figma design data, including node trees, styles, and screenshots.
04Secure localhost-only HTTP bridge for plugin-server interaction, ensuring data privacy.
05Extensive API for managing pages, components, design tokens, and core CRUD operations.
0634 GitHub stars
Use Cases
01Convert existing Figma designs into structured data or code, such as Tailwind CSS.
02Capture screenshots of Figma frames for AI analysis and description.
03Generate complex UI screens like dashboards in Figma directly from AI prompts.
