# HTML to Figma Design System

> Use this tool when you need to convert HTML prototypes into Figma designs while preserving the design system's structure and hierarchy. It solves the problem of manually recreating designs in Figma by automatically mapping HTML elements to design system components and tokens. The tool accepts HTML input and returns Figma-compatible component specifications, streamlining the design handoff process.

Canonical page: https://skillsregistry.net/skills/miapre-html-to-figma  
JSON: https://api.skillsregistry.net/v1/skills/miapre-html-to-figma

## Description

HTML to Figma Design System converts HTML prototypes into Figma designs by mapping HTML elements to actual design system components and design tokens. Unlike generic HTML-to-Figma converters, it preserves the design system's semantic structure and component hierarchy. The server accepts HTML input and returns Figma-compatible component specifications.

## Trust

- **Trust score (0–1):** 0.97
- **Verification tier:** verified
- **Last scanned:** 2026-09-19

## Facts

- **Version:** 1.0.0
- **Skill type:** atomic
- **Execution layer:** mcp-remote
- **Runtime environment:** api
- **Category:** maps-location
- **Updated:** 2026-09-19

## Source

- **Source listing:** [PulseMCP](https://www.pulsemcp.com/servers/miapre-html-to-figma)
- **Repository:** <https://github.com/miapre/mimic-ai>

## Use it

Resolve this record through the SkillsRegistry MCP server (no auth, read-only):

```
claude mcp add --transport http --scope user skillsregistry https://api.skillsregistry.net/mcp
```

```json
{
  "jsonrpc": "2.0",
  "id": 1,
  "method": "tools/call",
  "params": {
    "name": "get_skill",
    "arguments": {
      "slug": "miapre-html-to-figma"
    }
  }
}
```

REST: `GET https://api.skillsregistry.net/v1/skills/miapre-html-to-figma` · pull for local use: `GET https://api.skillsregistry.net/v1/skills/miapre-html-to-figma/pull`

---
SkillsRegistry indexes agent skills from public registries and GitHub. Skills we have analysed are scanned with Circle-IR and scored on six dimensions; each listing states its scan coverage. More: https://skillsregistry.net/llms.txt