What is Figma to Code?
Figma to Code is a Model Context Protocol (MCP) server that allows AI assistants like Claude, Cursor, and VS Code to extract all components from figma file and get all graphql queries and mutations
Extract all components from Figma file and get all graphql queries and mutations
This server falls under the Search & Data Extraction category on MCPgee, the world's largest MCP server directory with 33,000+ servers.
Features
- extract-components
- extract-latest-components
- extract-one-component
Use Cases
Maintainer
Works with
Installation
NPM
npx -y @kailashg101/mcp-figma-to-codeManual Installation
npx -y @kailashg101/mcp-figma-to-codeConfiguration
Configuration Details
claude_desktop_config.json
Performance
Response Metrics
Resource Usage
Frequently Asked Questions about Figma to Code
What is Figma to Code?
Figma to Code is a Model Context Protocol (MCP) server that extract all components from figma file and get all graphql queries and mutations It connects AI assistants to external tools and data sources through a standardized interface.
How do I install Figma to Code?
Install via npm with the command: npx -y @kailashg101/mcp-figma-to-code. Then add the server configuration to your AI client's JSON config file (e.g., claude_desktop_config.json or .cursor/mcp.json).
Which AI clients work with Figma to Code?
Figma to Code works with all major MCP-compatible AI clients including Claude Desktop, Claude Code, Cursor, VS Code (GitHub Copilot), Windsurf, and Cline.
Is Figma to Code free to use?
Yes, Figma to Code is open source and available under the MIT license. You can use it freely in both personal and commercial projects.
Figma to Code Alternatives — Similar Search & Data Extraction Servers
Looking for alternatives to Figma to Code? Here are other popular search & data extraction servers you can use with Claude, Cursor, and VS Code.
TrendRadar
★ 58.0kA real-time hotspot monitoring and news aggregation assistant that provides AI-powered analysis of trending topics across multiple platforms via the Model Context Protocol. It enables users to track news and receive automated notifications through va
Scrapling
★ 52.7k🕷️ An adaptive Web Scraping framework that handles everything from a single request to a full-scale crawl!
PDF Math Translate
★ 33.9k[EMNLP 2025 Demo] PDF scientific paper translation with preserved formats - 基于 AI 完整保留排版的 PDF 文档全文双语翻译，支持 Google/DeepL/Ollama/OpenAI 等服务，提供 CLI/GUI/MCP/Docker/Zotero
GPT Researcher
★ 27.2kAn autonomous agent that conducts deep research on any data using any LLM providers
Agent Reach
★ 20.1kGive your AI agent eyes to see the entire internet. Read & search Twitter, Reddit, YouTube, GitHub, Bilibili, XiaoHongShu — one CLI, zero API fees.
Xiaohongshu
★ 13.7kMCP for xiaohongshu.com
Browse More Search & Data Extraction MCP Servers
Explore all search & data extraction servers available in the MCPgee directory. Each server includes setup guides for Claude, Cursor, and VS Code.
Set Up Figma to Code in Your Editor
Choose your AI client for step-by-step setup instructions.
Quick Config Preview
Add this to your claude_desktop_config.json or .cursor/mcp.json
Ready to use Figma to Code?
Browse our complete directory of 33,000+ MCP servers, read setup guides for your editor, and start building with the Model Context Protocol.