| name | mcp-figma |
| description | Use when implementing or reviewing UI from Figma files, frames, or design-system context. |
Figma MCP
Use this skill when the task depends on Figma design context such as frame structure, spacing, type scale, components, variables, or design-system patterns.
Only use this skill if the Figma MCP tools are available in the current assistant. If they are not available, say that Figma is not configured and continue with repo-local UI context.
Workflow
- Start from the specific Figma link, frame, or file the user provided.
- Extract the exact layout, components, spacing, typography, and variable usage that matter.
- Map the design to existing app components and tokens before inventing new ones.
- Call out ambiguous areas, missing assets, or mismatches with the current codebase.
- Use the design context to guide implementation or review comments.
Good Uses
- Implementing a screen from a Figma frame
- Comparing code to the source design
- Pulling design-system details into implementation planning
Avoid
- Treating Figma as a substitute for reading the existing app code
- Guessing at a design when no specific file or frame was provided