Agent skill · design visual · nexu-io
figma-generate-design
Build or update screens in Figma from code or description using design system components. Translate app pages into Figma using design tokens.
Why this skill is useful
Adds the ability to generate and update Figma designs from code using design tokens and components, which is not commonly known.
What it needs
About 1k tokens when loaded. Last updated 2026-08-07. 84,236 stars on the source repository.
What this skill does
figma-generate-design Curated from Figma's MCP server guide. What it does Build or update screens in Figma from code or description using design system components. Translate app pages into Figma using design tokens. 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: Then ask the agent to invoke this skill by name (figma-generate-design) or with one of the trigger phrases listed in this skill's frontmatter.
How to use it
Reference it in AdaL, Claude Code, Cursor or any coding agent — nothing to install:
@skills nexu-io/figma-generate-design