figma-design-system-inventory
One call to inventory an entire Figma design system — variables/tokens (grouped by collection + mode), components and component sets (with property definitions and per-variant visual specs), and styles (color/text/effect with resolved values). Use when you need the whole design-system picture before generating code or auditing coverage — triggers: 'inventory my design system', 'extract all tokens and components', 'what's in this design system', 'dump the design system kit', 'give me every variable, component, and style', 'build a design-system manifest', 'audit my Figma library'. Has a verbosi
npx skills add southleft/figma-console-mcp-skills --skill figma-design-system-inventory --agent claude-code
Same command for any agent — swap --agent for codex, cursor, copilot.
Weekly change comes from our own snapshots, not the repository page — it measures attention, not adoption.
# figma-design-system-inventory — unified tokens + components + styles extraction A single `use_figma` call that walks the whole file and returns a structured kit: **tokens** (every local variable, grouped by collection and mode), **components** (standalone components + component sets, with property definitions and a compact `visualSpec` per variant), and **styles** (paint/text/effect styles with their resolved values). It is the "read everything once" front door for code generation and library audits. ## Skill boundaries - **`use_figma` rules** — load the official **`figma-use`** skill first; it is the full Figma Plugin API reference. Essentials these scripts rely on: plain JS with top-level `await` + `return` (no IIFE, no `figma.closePlugin()`; `console.log` is not returned), inputs inlined as `const` at the top of each script, colors in 0–1 range, load fonts before any text op, `await figma.getNodeByIdAsync(...)`, and **atomic errors** (a failed script applies nothing — read the error, fix, retry). - **The exact shape of each `visualSpec`** → [references/visual-spec.md](references/visual-spec.md). - **One component in unlimited depth** (full tree, reactions, instance refs) → use
- Skill boundaries
- Workflow
- Notes
What does the figma-design-system-inventory skill do?
One call to inventory an entire Figma design system — variables/tokens (grouped by collection + mode), components and component sets (with property definitions and per-variant visual specs), and styles (color/text/effect with resolved values). Use when you need the whole design-system picture before generating code or auditing coverage — triggers: 'inventory my design system', 'extract all tokens and components', 'what's in this design system', 'dump the design system kit', 'give me every variable, component, and style', 'build a design-system manifest', 'audit my Figma library'. Has a verbosi
How do I install it?
Run `npx skills add southleft/figma-console-mcp-skills --skill figma-design-system-inventory --agent claude-code` — it drops the skill into your project so the agent can pick it up. Swap the --agent value for codex, cursor or copilot if you use one of those.
Where does this skill come from?
From southleft/figma-console-mcp-skills, a repository with 67 stars. We read it straight from the repository tree rather than a submitted listing, so what you see here is what is actually published.
Is a popular skill a good skill?
Not necessarily. Stars measure attention, not adoption — a repository can trend for a week and be abandoned. That is why we show the weekly change from our own snapshots next to the total, instead of a single flattering number.
