"How to generate HTML code from Figma design files" matching MCP servers:

Provides 8 MCP tools for frontend design: load design system, generate components, scaffold pages, review consistency, extract tokens, check WCAG 2.2 AA, test responsiveness, and export to Figma.

Converts a Figma file into a React project using Ant Design, AG Grid, ApexCharts, and Tailwind CSS, with optional export of mobile screens as a React Native (Expo) app.

Enables Claude Cowork on Windows to read, write, edit, list, find, and regex-search files inside a WSL distribution over stdio, accepting Windows and Linux path spellings. Access is confined to server-fixed roots, with secrets files refused, key-shaped strings redacted, and no delete or move operations.

MCP server that routes Claude Desktop chat into Claude Code, enabling headless execution and terminal handoff with session continuity.

An autonomous MCP server that uses the Claude Code CLI to solve coding problems without permission prompts.

MCP server for generating and editing images and videos via DashScope/OpenAI-compatible APIs, with tools for text-to-image, image editing, text/video generation, and automatic local download.

A design harness for AI coding agents. Better Design gives an agent design systems, UI and UX principles, icons and UI review: it finds or creates a design system that fits the product and installs its components, explains how sign-up, forms and onboarding should work, and reviews finished screens for readability, accessibility and unclear copy.

Generates test files locally (images, PDFs, CSVs, corrupted files, etc.) from natural language prompts, with configurable sizes and safety limits.

Converts Figma designs (frames, components, instances) into inspectable packets and static Unity UGUI YAML prefabs via the Figma REST API, enabling direct design-to-Unity asset generation.

Enables offline reading and rendering of Figma .fig files, allowing AI agents to extract design specs, export assets, and generate code without needing the Figma API or network access.

A lightweight MCP server for basic file operations, enabling reading, writing, and listing files securely via the Model Context Protocol.

Thin HTTP wrapper for the Generate-Data.com API, enabling data generation, schema proposal, and field type listing through MCP tools.

Enables AI-driven UI/UX design and prototyping in Figma by letting agents generate AutoLayout screens, modify canvas elements, and wire interactive prototype flows through natural language.

Enables high-craft web design and engineering through OKLCH color systems, fluid typography, Three.js 3D scenes, frontend security audits, multi-viewport capture, and Python-backed design verification.

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

Provides software design guidance via MCP, including SOLID principles, design patterns, pattern scaffolding, and heuristic code-smell detection to help review and refactor code.

Enables assistants to discover, search, and extract real design systems — palettes, type scales, spacing, surfaces, and do/don't guidance — from the public style pages of styles.refero.design. It reports index coverage with every search and renders matched styles as structured design.md sections or parsed JSON tokens.

An MCP server that provides design-pattern selection expertise to AI coding agents.

Allow 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 flows

MCP server bridging ChatGPT-compatible clients to the Design Flow System, enabling project session management, draft import, round locking, and read-only access to design state and traceability.

Converts Figma designs into structured code context with token-aware styling, enabling AI agents to generate production-level frontend code.

Enables reading and patching VRoid Studio 2.x .vroid files by inspecting textures and parameters, exporting layer PNGs, and writing verified new files with replaced layers, item colors, or saved settings.

Enables direct Figma interaction through REST with a personal access token and a local plugin bridge, supporting node/style/component inspection, variable and selection access, image export, and writing frames, rectangles, and text into open files without the official connector’s request limits.

Automated MCP server for the Insider Design System. Enables AI assistants to discover, understand, and generate code for over 60 Design System components with automated extraction from source code.

A remote MCP image generation server that unifies OpenAI Images and Gemini generateContent APIs with preset-based configuration for multi-provider support.

A read-only Figma MCP server that lets Claude list frames, read a frame's layout as flexbox, extract color and text styles as CSS variables, export icons as SVG, and render a PNG of the frame for visual comparison. This gives Claude everything it needs to build a matching web page from a design on Figma's free plan, with responses cached locally.

Enables AI agents to read, inspect, and export Figma designs programmatically. Provides tools for listing components, styles, and exporting assets in various formats.

Converts AI Skills (following Claude Skills format) into MCP server resources, enabling LLM applications to discover, access, and utilize self-contained skill directories through the Model Context Protocol. Provides tools to list available skills, retrieve skill details and content, and read supporting files with security protections.

embedded code search engine CLI -AST based that just works - improves speed and efficiency for coding agent

Gemini-powered MCP server for automated code review, analysis, and documentation.

A local-first FastMCP server that indexes offline frontend catalogs (components, patterns, motion libraries) and exposes discover, search, compare, and recommend tools to AI agents via stdio.

Enables AI assistants to retrieve and cite South Korean national construction standards (KDS/KCS) with tables and formula images via the KCSC OpenAPI, and to use design decision trees, validation, and blank Excel templates directly in the chat interface.

Enables AI agents to search, retrieve, and navigate Apple's Human Interface Guidelines as live Markdown content across all Apple platforms.

Serves bundled local engineering guidance—four instructions, a control Guide and 20 software engineering procedures—over local STDIO so coding agents can discover and read the right procedure for a task. It is read-only and stateless, leaving all project changes and permissions to the consuming agent.

MCP server for AI agents to send notifications, copy to clipboard, request confirmations, and collect text input from users across their devices.

Strict AI code reviewer powered by Groq. Finds bugs, vulnerabilities and security issues in your code. Supports analyze, compare versions, explain code, generate tests, and HTML reports.

Bridges Design OS exported component packages into target projects, handling migrations across different CSS, component, and icon libraries.

Enables AI agents to generate dimensionally accurate mechanical parts (gears, enclosures, brackets, assemblies) in headless Blender from plain-English specs or JSON parameters, then verify them against manifold, bounding-box and print-production gates and export glTF/STL assets. It also scaffolds interactive Three.js CAD viewer pages with orbit controls, wireframe toggles and exploded-view scrubbing.

Enables AI hosts to validate, write to disk, hot-reload, preview, and export single-file HTML prototypes built to the Spark OP design spec, serving them locally at 127.0.0.1:5179 by slug. Also bundles the triggering skill, spec references, templates, and CSS tokens so agents can create, revise, and hand off development-ready prototype HTML through one controlled output path.

Read, create, and modify Figma designs programmatically via MCP, empowering AI to execute Figma changes safer, cleaner, and faster.