figmalisted
Install: claude install-skill ulises-jeremias/agent-toolkit
# Figma MCP
Use the Figma MCP server for Figma-driven implementation. For setup and
debugging details (env vars, tool registration, verification), see
[`references/figma-mcp-config.md`](references/figma-mcp-config.md).
This is the **entry-point skill** for the Figma family. Switch to a more
specialized skill once intent is clear:
| If the user wants to… | Use |
|---|---|
| Translate a Figma node into production code | [`figma-implement-design`](../figma-implement-design/SKILL.md) |
| Generate a full screen in Figma from code/description | `figma-generate-design` (opt-in pack — see `docs/SKILLS.md`) |
| Author Code Connect mappings | [`figma-code-connect-components`](../figma-code-connect-components/SKILL.md) |
| Create reusable agent rules (`CLAUDE.md`/`AGENTS.md`) for a design system | [`figma-create-design-system-rules`](../figma-create-design-system-rules/SKILL.md) |
| Create a brand-new Figma file | [`figma-create-new-file`](../figma-create-new-file/SKILL.md) |
| Run JS in Figma via the Plugin API | `figma-use` (opt-in pack — see `docs/SKILLS.md`) |
| Generate/import a full library | `figma-generate-library` (opt-in pack — see `docs/SKILLS.md`) |
## Figma MCP Integration Rules
These rules define how to translate Figma inputs into code for this project and
must be followed for every Figma-driven change.
### Required flow (do not skip)
1. Run `get_design_context` first to fetch the structured representation for
the exact node(s).
2. If the response is too large or