setup-design-tokens-figma

Installation
SKILL.md

setup-design-tokens-figma — atomic token-system bootstrap

Create a variable collection + modes + all variables in a single use_figma call. This is the fastest way to stand up a new token system (or a new collection within one). Because it runs as one atomic script, either everything is created or nothing is (failed scripts apply no changes).

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).
  • Incremental CRUD / batch edits to an existing system → manage-variables-figma.
  • Sync from a code token file → import-tokens-figma.

Workflow

Installs
6
GitHub Stars
4
First Seen
Jun 1, 2026
setup-design-tokens-figma — southleft/skills-for-figma