figma-generate-library
figma generate library
What it does
- Post a user-facing checklist titled Phase N Checklist.
- Include every task/subtask that will be attempted in that phase.
- Include the phase exit criteria.
- Do not begin mutating work for the phase until this checklist has been posted.
- If the phase requires explicit approval, ask for approval after the checklist and wait.
- Before each major subsection, post a short update naming the exact section being worked on, using this format:
- Keep updates concise, but make the current work visible.
Requirements & configuration
- If the phase requires explicit approval, ask for approval after the checklist and wait.
- [ ] 0d. Lock v1 scope → exact token set + component list recorded before any creation
- [ ] Exit criteria met: every token from the agreed plan exists, all scopes set, all code syntax set
- 1. Variables BEFORE components — components bind to variables. No token = no component.
- Component property API matches your needs (same variant axes, compatible types)
Configuration: ALL_SCOPESFRAME_FILLTEXT_FILLSTROKE_COLORCORNER_RADIUS
Derived from the skill's own SKILL.md documentation · extracted 2026-07-23
figma-generate-library FAQ
What does the figma-generate-library skill do?
Build or update a professional-grade design system in Figma from a codebase. Use when the user wants to create variables/tokens, build component libraries, create individual components with proper variant sets and variable bindings, set up theming (light/dark modes), document foundations, or reconcile gaps between code and Figma. Also use when the user asks to create or generate any component in Figma — even a single one — since components require proper variable foundations, variant states, and design token bindings to be production-quality. This skill teaches WHAT to build and in WHAT ORDER — it complements the `figma-use` skill which teaches HOW to call the Plugin API. Both skills should be loaded together. Post a user-facing checklist titled Phase N Checklist. Include every task/subtask that will be attempted in that phase.
What does figma-generate-library require?
If the phase requires explicit approval, ask for approval after the checklist and wait. [ ] 0d. Lock v1 scope → exact token set + component list recorded before any creation [ ] Exit criteria met: every token from the agreed plan exists, all scopes set, all code syntax set 1. Variables BEFORE components — components bind to variables. No token = no component. Component property API matches your needs (same variant axes, compatible types) Configuration keys: ALL_SCOPES, FRAME_FILL, TEXT_FILL, STROKE_COLOR, CORNER_RADIUS.
How do I install figma-generate-library?
Run: npx -y skills add https://github.com/figma/mcp-server-guide --skill figma-generate-library --agent claude-code — the source lives at github.com/figma/mcp-server-guide.
Maintain figma-generate-library?
Let people know it's listed here — add the badge (live metrics, light/dark aware) or a plain link to your README or docs.
[figma-generate-library on getagentictools](https://getagentictools.com/skills/figma-mcp-server-guide-figma-generate-library?ref=badge) npx agentictools info skills/figma-mcp-server-guide-figma-generate-library The second line is the CLI lookup for this page — handy in READMEs and docs.
