HTML to Figma - Design System MCP Server

Transforms HTML into Figma using only your design system, enforcing correct component usage and falling back safely when needed, while improving accuracy with every build. It runs locally over stdio via the published package.

People connecting design tools to Claude, Cursor, VS Code, or another MCP client. The project is written in JavaScript.

VERIFIED ACTIVE

LAST COMMIT 2026-07-15 · ★ 13 · #55 OF 74 MAINTAINED DESIGN · VERIFIED 2026-08-25

MIT · JavaScript servers · how we verify → /methodology

01 · Install HTML to Figma - Design System

before you install - you'll need

The README does not document required environment variables for a basic install.

Claude Code

claude mcp add miapre-html-to-figma-design-system -- npx -y html-to-figma-design-system

Claude Desktop / Cursor / VS Code - add to config

{
  "mcpServers": {
    "miapre-html-to-figma-design-system": {
      "command": "npx",
      "args": [
        "-y",
        "html-to-figma-design-system"
      ]
    }
  }
}

Same JSON for Cursor. For VS Code, rename the top-level key from `mcpServers` to `servers`.

Using another client? Same JSON, different key

Claude Desktop · mcpServers

Cursor · mcpServers

VS Code · servers

Windsurf · mcpServers

Zed · context_servers

Cline · mcpServers

Roo Code · mcpServers

Continue · mcpServers

LibreChat · mcpServers

Gemini CLI · mcpServers

Codex CLI · mcp_servers

Full setup guides: every client.

02 · Evidence

Security posture

What to check before giving this server access to your agent - from the registry, GitHub, and our own probes. We don't score safety; we show what's verifiable.

runs as local process (stdio) - runs on your machine with your user's permissions

license MIT - declared in the repository

npm package html-to-figma-design-system - unscoped; check the name against the project README before installing

registry namespace io.github.miapre is GitHub-verified and matches the repo owner

03 · What HTML to Figma - Design System can do

Prose above is summarized from the project's README and registry record - no invented capabilities.

Latest releases

v3.0.0 · 2026-07-14

Breaking release: the tool surface is consolidated from 58 tools to 26. · Modern MCP hosts defer and search large tool sets, so a lean surface with precise, self-contained descriptions gets picked up better and burns…

v2.1.0 · 2026-07-14

The biggest release since v2 stable: a full internal audit followed by same-day remediation of everything it found, plus a rebuilt learning system. · Security · Fixed three audit findings, including a HIGH: the…

v1.2.0 · 2026-04-23

Learns your design system. Builds with it. Gets better every time. · New tools · Build report generator - DS compliance, learned patterns, gap recommendations as a shareable report (markdown or HTML) · DESIGN.md…

04 · Who maintains HTML to Figma - Design System

HTML to Figma - Design System is maintained by miapre. We track 2 MCP servers from miapre - 2 actively maintained, 26 combined GitHub stars, oldest repo from Apr 2026. Full record: all servers from miapre.

  1. Mimic AI Builds Figma from your design system: real components and tokens, enforced, learning every build. ★ 13

05 · Facts

category
design - ranked #55 of 74 actively-maintained design servers as of 2026-08-25.
release cadence
2 releases in the last 90 days (latest 2026-07-14)
registry
io.github.miapre/html-to-figma-design-system (active, first published 2026-04-11)
packages
npm:html-to-figma-design-system

06 · HTML to Figma - Design System FAQ

What is HTML to Figma - Design System?

Transforms HTML into Figma using only your design system, enforcing correct component usage and falling back safely when needed, while improving accuracy with every build. It runs locally over stdio via the published package.

Is HTML to Figma - Design System still maintained?

Yes - as of 2026-08-25, its last commit was 2026-07-15 and it shipped 2 releases in the last 90 days. We re-verify nightly.

How do I install HTML to Figma - Design System?

Run `npx -y html-to-figma-design-system`. The README does not document required environment variables for a basic install. You can also paste the ready-made client config above.

Does HTML to Figma - Design System run locally?

Yes - it's a stdio server: it runs on your machine (via npx) with your user's permissions. Your data stays local unless the server itself calls external APIs.

07 · Alternatives to HTML to Figma - Design System

More design MCP servers · Mimic AI · Mobbin · UI Registry · Agent SUMO · Figma Edit MCP

More JavaScript MCP servers · Linksee Memory · Agent402.Tools: pay-per-call web tools · Cws · Gsc · see all