HTML to Figma — Design System
local MCP serverInstallation
Terminal
claude mcp add html-to-figma-design-system -- npx -y html-to-figma-design-system
Run in your project folder. Add --scope user to use it everywhere.
Claude Desktop, Cursor & other clients
Add to claude_desktop_config.json or .cursor/mcp.json.
{
"mcpServers": {
"html-to-figma-design-system": {
"command": "npx",
"args": [
"-y",
"html-to-figma-design-system"
]
}
}
}Summary
Translate HTML prototypes into Figma using your design system's real components and tokens.
Questions
HTML to Figma — Design System is a local MCP server distributed as the npm package html-to-figma-design-system.
Run: claude mcp add html-to-figma-design-system -- npx -y html-to-figma-design-system
Run: codex mcp add html-to-figma-design-system -- npx -y html-to-figma-design-system
Similar MCP servers
NameStars
- Mimic AIio.github.miapre/mimic-ai13
- Figma MCP Servercom.figma.mcp/mcp2,027
- melta UIio.github.tsubotax/melta-ui201
- plumb-mcpio.github.tathagat22/plumb-mcp84
- Roast My Design Systemio.github.gregkozakiewicz/roast-my-design-system25
- Roast My Design Systemio.github.pencilrebel/roast-my-design-system25
- StyleKitio.github.AnxForever/stylekit-mcp549
- figma-ui-mcpio.github.TranHoaiHung/figma-ui-mcp256