Map Figma components to accurate code snippets.
What it does
Creates parserless Code Connect template files that map Figma components to code snippets.
When to use it
Use for Code Connect, Figma component mapping, design-to-code translation, or creating and updating Figma template files.
How to use it
Give it a Figma URL and project; it proposes a code-component match for confirmation, then creates .figma.ts templates in the project.
What you provide
- a Figma URL with node-id
- An existing project
Uses
Latest review
What you need · 4
The Figma MCP server must be connected and its Code Connect tools available.
The components being mapped must already be published to a Figma team library.
Code Connect requires a Figma Organization or Enterprise plan.
Access · 1
This skill
Figma
Read
Reads Figma component metadata