# MCP Figma to React Converter

> Use this tool when you need to streamline your front-end development process by converting Figma designs into reusable React components with TypeScript and Tailwind CSS. It solves the problem of manual coding by extracting components from Figma files and transforming them into ready-to-use code, saving time and reducing errors. The tool takes Figma files as input and outputs React components with TypeScript and Tailwind CSS, making it ideal for use cases where design-to-code automation is necessary.

Canonical page: https://skillsregistry.net/skills/studentofjs-mcp-figma-to-react  
JSON: https://api.skillsregistry.net/v1/skills/studentofjs-mcp-figma-to-react

## Description

Converts Figma designs into React components with TypeScript and Tailwind CSS by extracting components from Figma files and transforming them into ready-to-use code.

## 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:** file-system
- **Updated:** 2026-09-19

## Source

- **Source listing:** [Glama](https://glama.ai/mcp/servers/gjjki9r0xg)
- **Repository:** <https://github.com/StudentOfJS/mcp-figma-to-react>

## 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": "studentofjs-mcp-figma-to-react"
    }
  }
}
```

REST: `GET https://api.skillsregistry.net/v1/skills/studentofjs-mcp-figma-to-react` · pull for local use: `GET https://api.skillsregistry.net/v1/skills/studentofjs-mcp-figma-to-react/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