-
securityA
license-
qualityConverts Figma designs into React components with TypeScript and Tailwind CSS by extracting components from Figma files and transforming them into ready-to-use code.
Last updated
73
MIT
21,642 servers. Last updated
Search Relevance ↓
Recent Usage ↓
Date Added ↓
Date Updated ↓
Weekly Downloads ↓
GitHub Stars ↓
Recent GitHub Stars ↓
Matching MCP tools:
Matching MCP Connectors:
com.figma.mcp
ai.smithery
actor.apify.godberry--content-to-social-mcp
to.unified.docs
"figma to code" matching MCP servers:
- -securityAlicense-qualityEnables AI agents like Claude to interact with Figma designs through 50+ tools for creating, styling, and manipulating design elements, components, and variables via a WebSocket relay and Figma plugin.Last updatedMIT
- AsecurityAlicense-qualityAutomates the conversion of Figma designs into TypeScript React components and integrates with GitHub to create pull requests for the generated code. It includes visual regression testing with Playwright and accessibility validation to ensure implementations match the original designs.Last updated57MIT
- -securityAlicense-qualityAn MCP server that enables AI assistants to interact with Figma designs for tasks like reading document info, creating elements, and managing auto layouts. It facilitates real-time design automation via a custom Figma plugin and WebSocket server integration.Last updated2,133MIT
- AsecurityAlicense-qualityAllows Cursor AI to communicate with Figma for reading designs and modifying them programmatically through a Model Context Protocol integration.Last updated382,1331MIT
- AsecurityFlicense-qualityEnables Cursor AI to interact with Figma designs, allowing users to read design information and programmatically modify elements through natural language commands.Last updated402,1333
- AsecurityAlicense-qualityEnables Cursor AI to communicate with Figma for reading designs and modifying them programmatically, allowing users to automate design tasks through natural language.Last updated382,1331MIT
- AsecurityAlicense-qualityEnables Claude Desktop and other AI tools to interact directly with Figma, allowing for powerful AI-assisted design capabilities through natural language commands.Last updated43766557MIT
- AsecurityAlicense-qualityAn MCP server integration that enables Cursor AI to communicate with Figma, allowing users to read designs and modify them programmatically through natural language commands.Last updated192,1336,605MIT
- Asecurity-license-qualityEnables users to control the cursor in Figma through verbal commands using an agentic AI agent, streamlining the design process with a new interaction method.Last updated192,1331
- AsecurityAlicense-qualityImplements a Model Context Protocol integration between Cursor AI and Figma, allowing Cursor to programmatically read and modify Figma designs.Last updated332,133MIT
- AsecurityFlicense-qualityConverts Figma designs to React Native components, allowing users to extract components from Figma designs and generate corresponding React Native components with proper typing and styling.Last updated31918
- -securityAlicense-qualityEnables AI coding agents to extract Figma design data and convert it into Flutter widgets and screens. Supports theme setup, component analysis, asset exports, and provides Flutter implementation guidance from Figma designs.Last updated70229MIT
- MIT
- AsecurityFlicense-qualityA server that converts Figma designs into pseudo-code structures optimized for LLMs to understand design context, allowing easy extraction of visual elements and code-like representations from Figma files.Last updated235
- -securityAlicense-qualityEnables AI assistants like Claude Desktop to interact directly with Figma, allowing natural language commands to create, modify, and analyze designs including shapes, text, components, and layouts in real-time.Last updatedMIT
- -securityAlicense-qualityEnables AI coding agents to access Figma design data by fetching and simplifying layout and styling metadata. This allows developers to accurately implement UI designs in code directly from Figma file links.Last updated171,353MIT
- -securityAlicense-qualityEnables AI assistants like Claude and Cursor to interact directly with Figma to create, modify, and analyze design elements in real-time. It provides a comprehensive suite of tools for document inspection, styling, component management, and automated layout via a bidirectional WebSocket connection.Last updated766MIT
- AsecurityAlicense-qualityEnables interaction with Figma designs through the Figma API, allowing users to export images in multiple formats, extract style data and CSS, analyze design elements, and retrieve SVG code from Figma files. Supports batch operations and comprehensive design element analysis including images, vectors, and components.Last updated73410MIT
- -securityAlicense-qualityA server that enables Cursor AI to generate code from Figma components by connecting to Figma's MCP Dev Server.Last updatedMIT
- -securityAlicense-qualityA Model Context Protocol server that integrates Figma design files with AI coding tools like Cursor, Windsurf, and Cline, allowing AI tools to access and understand Figma design data for generating more accurate code.Last updated18520MIT
- AsecurityAlicenseBqualityFigma MCP server with full read/write access via plugin bridge — no API token, no rate limits. 58 tools for design automation: styles, variables, components, prototypes, and content.Last updated258583MIT
- AsecurityAlicense-qualityAllow your AI coding agents to access Figma files & prototypes directly. You can DM me for any issues / improvements: https://x.com/jasonzhou1993 1. Access all figma pages 2. Access all figma components 3. Access figma prototype flowsLast updated66MIT
- AsecurityFlicense-qualityEnables extraction of design context from Figma files as CSS-like properties and provides tools to render Figma nodes as images. It integrates with AI agents via the Model Context Protocol to facilitate design-to-code workflows by providing layout, style, and typography information.Last updated2
- -securityAlicense-qualityEnables Cursor to access Figma files through the Model Context Protocol, enhancing its ability to accurately interpret and utilize design data for code generation.Last updated171,35314,396MIT
- -security-license-qualityA Model Context Protocol (MCP) server that enables Claude to create and manipulate designs in Figma through either a Figma plugin or directly via the Figma API.Last updated
- -securityAlicense-qualityProfessional Model Context Protocol server that enables AI-optimized Figma design analysis and comprehensive design-to-code conversion through a structured 5-step workflow.Last updated12127MIT
- -securityAlicense-qualityProvides AI coding agents with access to Figma design data through the Figma API. Enables accurate one-shot implementation of designs in any framework by translating Figma files into simplified layout and styling information.Last updated5MIT
- AsecurityFlicense-qualityA bridge between Figma designs and React implementations that enables pixel-perfect conversion of Figma designs into React applications by processing Figma file data into React-friendly format.Last updated52,8182
- AsecurityFlicense-qualityEnables AI assistants to interact with Figma files through the ModelContextProtocol, allowing viewing, commenting, and analyzing Figma designs directly in chat interfaces.Last updated52,818210
- AsecurityFlicense-qualityEnables seamless interaction with Figma via the Model Context Protocol, allowing LLM applications to access, manipulate, and track Figma files, components, and variables.Last updated1,794147
- AsecurityFlicense-qualityA Model Context Protocol server that provides access to Figma API functionality, allowing AI assistants like Claude to interact with Figma files, comments, components, and team resources.Last updated183914
- -securityAlicense-qualityFigma MCP with full API functionalityLast updated49867MIT
- -securityAlicense-qualityEnables Claude to read and manipulate Figma documents in real-time through 62 operations including creating shapes, modifying styles, managing components, and exporting assets via a WebSocket bridge to a Figma plugin.Last updated3947MIT
- AsecurityFlicense-qualityA tool that integrates Figma with Cursor through the Model Context Protocol, allowing users to retrieve, optimize, and convert design data from Figma files into structured CSS and design tokens.Last updated1
- AsecurityFlicense-qualityProvides AI assistants with structured access to complete Figma developer documentation, including Plugin, Widget, and REST APIs. It enables users to search and read over 600 documentation pages to facilitate Figma-related development tasks.Last updated34
- AsecurityAlicense-qualityA Model Context Protocol server for interacting with the Figma API that handles large Figma files efficiently through memory-aware chunking and pagination capabilities.Last updated7184MIT
- AsecurityAlicense-qualityExecutes Python code in isolated rootless containers while proxying MCP server tools, reducing context overhead by 95%+ and enabling complex multi-tool workflows through sandboxed code execution.Last updated1323
- -securityFlicense-qualityExecutes TypeScript code in a secure sandbox with IPC-bridged access to MCP tools like filesystem operations and network requests.Last updated3
- -securityAlicense-qualityEnables AI coding tools like Cursor to access Figma design files and metadata, allowing accurate one-shot implementation of designs in any framework by providing simplified layout and styling information from the Figma API.Last updated171,3531MIT
- -securityAlicense-qualityGives AI-powered coding tools like Cursor, Windsurf, and Cline access to Figma design files, enabling more accurate code generation directly from Figma designs.Last updated171,353MIT
- -securityFlicense-qualityEnables integration with Figma through the Model Context Protocol, allowing users to interact with Figma designs and files using their Personal Access Token. Provides containerized deployment options and Server-Sent Events endpoint for real-time communication.Last updated1,794
- -securityFlicense-qualityEnables AI assistants to read Figma design files and automatically map responsive relationships between mobile and desktop screens to generate accurate frontend code. Eliminates manual copy-pasting by providing direct access to design tokens, dimensions, and screen layouts within AI-powered IDEs.Last updated
- AsecurityAlicense-qualityEnables automated export, compression, and cloud upload of Figma design assets by simply providing Figma links. Supports batch processing of nodes and children, returning structured data with publicly accessible image URLs.Last updated13MIT
- -securityAlicense-qualityFigma MCP Bridge is a combined Figma plugin and MCP server that bypasses Figma's free API rate limits by streaming live document data directly to AI tools via a local WebSocket connection instead of the standard cloud API.Last updated126MIT
- -securityFlicense-qualityEnables AI agents to write and execute Python code in an isolated sandbox that can orchestrate multiple MCP tool calls, reducing context window bloat and improving efficiency for complex workflows.Last updated22
- AsecurityFlicense-qualityEnables interaction with Figma files through tools that list projects/files, fetch design data, and generate React+Vite frontend code directly from Figma frames.Last updated41,794
- -securityFlicense-qualityConnects AI applications to Figma API for extracting design data, generating production-ready HTML/CSS from designs, and capturing screenshots in multiple formats.Last updated2,818
- AsecurityAlicense-qualityFacilitates the analysis of Figma file structures by extracting node hierarchies, accessible via REST API or MCP protocol.Last updated11,7942MIT
- -securityFlicense-qualityA Model Context Protocol server that connects AI tools and LLMs to Figma designs, enabling them to extract design data, analyze design systems, and generate development documentation.Last updated1,7942