HTML to Figma — Design System

io.github.miapre/html-to-figma-design-system

Translate HTML prototypes into Figma using your design system's real components and tokens.

View repository →Homepage →

Connect this server

Add this to your MCP client config — claude_desktop_config.json (Claude Desktop) or .cursor/mcp.json (Cursor).Suits: Claude Desktop · Cursor.

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

A starting point — check the repository for exact arguments and setup. Restart your client after editing the config.

Category
Developer Tools
Version
1.1.0
Registry
active
Published
4/11/2026

More Developer Tools servers

Browse all Developer Tools →

Mimic AI

miapre

Builds Figma from your design system: real components and tokens, enforced, learning every build.

Developer ToolsAdded 3 months ago

io.github.Mibayy/token-savior

Mibayy

Structural codebase MCP server with persistent memory: navigate by symbol, recall across sessions.

Developer ToolsAdded 3 months ago

io.github.Mibayy/token-savior-recall

Mibayy

Structural codebase MCP server with persistent memory: navigate by symbol, recall across sessions.

Developer ToolsAdded 3 months ago

RepeaterBook

MicaelJarniac

Look up amateur radio repeaters from RepeaterBook.com by location, band, and mode.

Developer ToolsAdded 2 months ago

io.github.michael-denyer/hot-memory-mcp

michael-denyer

Two-tier memory: hot cache (0ms) + semantic search. Self-organizing.

Developer ToolsAdded 4 months ago

io.github.Michael-Drake/rentctl

Michael-Drake

Leased dev environments — every server dies when its AI session ends.

Developer ToolsAdded 1 month ago

Add the badge to your site

Show visitors that HTML to Figma — Design System is listed here — it’s also the link we check for a free listing.

HTML to Figma — Design System — listed on Serverdex

HTML — for your website

<a href="https://serverdex.io/server/io-github-miapre-html-to-figma-design-system?utm_source=badge"><img src="https://serverdex.io/brand/badge.svg" alt="HTML to Figma — Design System — listed on Serverdex" width="123" height="40" loading="lazy"></a>

Recommended. A dofollow link from your own domain is the one that counts for search engines, and it's the link we check for a free listing.

Markdown — for your README

[![HTML to Figma — Design System — listed on Serverdex](https://serverdex.io/brand/badge.svg)](https://serverdex.io/server/io-github-miapre-html-to-figma-design-system?utm_source=badge)

Nice for visibility, but GitHub marks README links nofollow, so it doesn't pass authority. Use the HTML badge on your site as well.