"Figma design tool and resources" matching MCP servers:

The pixel-diff verifier for Figma-to-code: converts a frame to HTML, React, Next.js or Tailwind with design tokens, then renders it and pixel-diffs it against Figma until it converges. Also verifies your own running app.

Enables interaction with Figma files through intelligent API access, providing navigation, asset extraction, and design token retrieval with 95% token-optimized compact tree output format.

Bridge Figma designs to any platform with structured specs for Unity, React, Flutter, SwiftUI, and more, including layout audit, design tokens, and accessibility checks.

Converts Figma designs into production-ready React components with design token extraction, widget registry integration, and micro-frontend module generation.

Enables deterministic, headless access to Figma design files from AI agents and CI workflows using a personal access token, with tools for design snapshots, node search, text extraction, variables/tokens, and project discovery.

Enables 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.

Enables Cursor AI to interact with Figma designs, allowing users to read design information and programmatically modify elements through natural language commands.

Enables 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.

Enables Cursor AI to communicate with Figma for reading designs and modifying them programmatically, allowing users to automate design tasks through natural language.

A 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.

A 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.

Enables AI coding tools like Cursor to access Figma design data through the Model Context Protocol, allowing accurate implementation of designs across frameworks. Based on NCDS (NHN Commerce Design System) with enhanced source generation capabilities.

Provides Figma design context to AI agents, enabling code generation, design system integration, and canvas manipulation through MCP.

Enables bidirectional synchronization between IDEs and Figma for Design System management, allowing developers to generate React components and synchronize design tokens, icons, and components across platforms.

Enables 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.

An MCP server that gives AI coding agents access to Figma design data, enabling pixel-perfect implementation of designs through structured data extraction, image downloads, and design token retrieval.

Enables AI agents to extract design systems, analyze components, and maintain design-code consistency from Figma files, providing intelligent component analysis and accessibility compliance.

Model Context Protocol integration for the Figma API, enabling AI applications to access Figma files, components, and design tokens.

Transforms Figma design data into a compact, LLM-friendly format for code generation, reducing size by 99.5% while preserving UI-critical information.

Enables AI coding agents to access Figma files and prototypes, allowing them to retrieve design data and assets directly.

Enables 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.

Enables 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.

A Model Context Protocol (MCP) server that enhances Figma design integration by adding element position information to API responses, enabling AI assistants to better understand spatial relationships and convert designs to code more accurately.

A self-hosted MCP server that enables AI agents to retrieve Figma design data for generating code, templates, or custom prompts.

Connects AI applications to Figma API for extracting design data, generating production-ready HTML/CSS from designs, and capturing screenshots in multiple formats.

Connects Figma to Claude via MCP for auditing design systems, checking naming conventions, and analyzing component consistency using the public Figma API.

Enables Cursor to access Figma files through the Model Context Protocol, enhancing its ability to accurately interpret and utilize design data for code generation.

. A good description should be concise and describe what the server enables users to do, e.g. * Enables to interact with WordPress sites...' Then a huge block? Actually the user message includes the README content inside tags, then after the readme, there is a large block of text starting with '{

Token-efficient Figma MCP server with image export, query DSL, and design token support.

Provides 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.