figma-code-connect-components
About figma-code-connect-components
figma-code-connect-components is an agent skill for linking Figma design components with code components through Code Connect. It helps design-system updates flow into the codebase; the catalogue points to Figma's upstream skill bundle for the full workflow.
Key features
- 01Link Figma and code components
- 02Use Code Connect
- 03Propagate design-system updates
Use cases
- 01Connect design components to code
- 02Keep code aligned with design-system updates
Install
Copy the command and run it in a terminal.
npx skills add https:/ / github.com/ nexu-io/ open-design --skill figma-code-connect-componentsAfter installing, type/figma-code-connect-componentsin Claude Code to confirm it loaded.
Details
From the project READMEfigma-code-connect-components
Curated from Figma's MCP server guide.
What it does
Connect Figma design components to code components using Code Connect so design-system updates flow into the codebase automatically.
Source
- Upstream: https://github.com/figma/skills
- Category:
figma
How to use
This catalogue entry advertises the skill in OpenDesign so the agent discovers it during planning. To run the full upstream workflow with its original assets, scripts, and references, install the upstream bundle into your active agent's skills directory:
# Inspect the upstream README for exact paths
open https://github.com/figma/skills
Then ask the agent to invoke this skill by name (figma-code-connect-components) or with
one of the trigger phrases listed in this skill's frontmatter.