claude-talk-to-figma-mcp and sunnysideFigma-Context-MCP
These are complementary tools that serve different integration depths: the first enables basic design reading and modification through Claude, while the second provides specialized extraction tools (30+ features) for converting Figma designs into production-ready code and assets, so teams might use both together—the first for interactive design analysis and the second for automated asset/code generation workflows.
About claude-talk-to-figma-mcp
arinspunk/claude-talk-to-figma-mcp
A Model Context Protocol (MCP) that allows Claude Desktop and other AI tools (Claude Code, Cursor, Antigravity, etc.) to read, analyze, and modify Figma designs
Implements a WebSocket-based plugin architecture that bridges Figma Desktop with MCP servers, enabling real-time bidirectional communication without requiring a Dev Mode license. Supports design analysis (contrast audits, component scanning), bulk modifications (colors, typography, auto-layout), and code generation (React/Vue/SwiftUI components with design tokens). Integrates across multiple AI agents including Claude Desktop, Cursor, Windsurf, and VS Code extensions via configurable MCP server setup.
About sunnysideFigma-Context-MCP
tercumantanumut/sunnysideFigma-Context-MCP
A comprehensive Model Context Protocol (MCP) server that bridges Figma designs with AI development workflows. It provides 30 specialized tools for extracting pixel-perfect code, assets, and component structures directly from Figma designs.
Implements three integration modes (Figma plugin, Dev Mode bridge, and direct API) with real-time design token extraction, conflict detection, and batch asset optimization. Built as an MCP server that parses actual CSS values and design systems from Figma, then generates production code in React, Vue, Tailwind, or styled-components based on natural language requests from AI agents.
Related comparisons
Scores updated daily from GitHub, PyPI, and npm data. How scores work