Manage variables figma
Skill southleft/skills-for-figma/skills/manage-variables-figma
Create, update, rename, delete, and organize Figma variables, collections, and modes — including fast batch create/update, setting scopes, code syntax, and adding theme modes. Use for incremental variable work: triggers 'create a variable', 'batch update variables', 'add a dark mode to my collection', 'rename this variable', 'set variable scopes', 'delete a variable/collection', 'add a mode'. Works on ANY Figma plan. For a from-scratch system use setup-design-tokens-figma; for code↔Figma sync use import-tokens-figma / export-tokens-figma.From its SKILL.md
npx -y skills add southleft/skills-for-figma --skill manage-variables-figmaAssembled from the repository path, not quoted from the project. Check it against their README if it does not work.
One thing to look at
- 12 stars12 stars. Stars are a popularity signal and not a quality one, but at this level it is likely that nobody has read this closely except its author, and you would be relying on your own review.
SKILL.md
2.9 KB, 614 tokens by cl100k_base, as published. Nobody here has run it
manage-variables-figma — variable / collection / mode CRUD
Incremental, surgical edits to a Figma variable system: create one or many, update values in bulk,
rename, set scopes and code syntax, add/rename modes, and delete. All via use_figma, on any plan.
Skill boundaries
use_figmarules — load the officialfigma-useskill first; it is the full Figma Plugin API reference. Essentials these scripts rely on: plain JS with top-levelawait+return(no IIFE, nofigma.closePlugin();console.logis not returned), inputs inlined asconstat 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).- From-scratch bootstrap →
setup-design-tokens-figma. Code sync →import-tokens-figma/export-tokens-figma.
Workflow
- Identify targets. Most ops need IDs. Get
variableId/modeId/collectionIdfrom theexport-tokens-figmaread script orget_variable_defs. Collections can also be looked up by name inside the script. - Pick the operation from references/variable-ops.md — it has a
complete, copy-paste
use_figmasnippet for each: create collection, create variable, batch create, batch update, rename, set scopes, add/rename mode, delete. - Run via
use_figma(skillNames: "manage-variables-figma"). For large value updates usescripts/batch-update-variables.js(10–50× faster than one-call-per-value). - Confirm. Every snippet returns the affected IDs/names. Read back with
get_variable_defsto verify. For deletes, confirm with the user first — removing a collection deletes all its variables and unbinds anything referencing them.
Key rules
- Colors are 0–1 range. Use
hexToRgbfor hex input. - Always set
scopeson new variables — the defaultALL_SCOPESpollutes every picker. - Set code syntax (
setVariableCodeSyntax('WEB', '--token-name')) so design↔code naming lines up. - Renames are safe — they preserve values and existing bindings. Deletes are destructive.
- Aliases: bind one variable to another with
v.setValueForMode(modeId, figma.variables.createVariableAlias(targetVar)).
What ships with it: 2 files
5.4 KB alongside SKILL.md, 1 of them executable
references/
- variable-ops.md3.3 KB
scripts/
- batch-update-variables.jsruns2.2 KB
Gives 0 of the 12 instructions most images graphics skills give in 614 tokens
Counted across 341 of the 354 authors here whose files we hold, read 2026-09-06
- Generate images via gemini_generate_imagein 14 of 341, across 10 files
- Set the aspect ratio via set_aspect_ratioin 14 of 341, across 10 files
- Verify MCP image tools are available before generatingin 13 of 341, across 9 files
- Show estimated cost before generatingin 13 of 341, across 9 files
- Run the post-generation SEO checklistin 13 of 341, across 9 files
- Structure prompts as subject, setting, style, lighting, compositionin 10 of 341, across 5 files
- Infer the brand strategy before generatingin 9 of 341, across 5 files
- Use at most two logo concept methodsin 9 of 341, across 5 files
- Use one dominant palette with repeating accentsin 9 of 341, across 5 files
- Extract fileKey and nodeId from the Figma URLin 9 of 341
- Read product marketing context before asking questionsin 8 of 341, across 3 files
- Keep the logo simple, symbolic, and ownablein 8 of 341, across 4 files
Said here and by no other author read
- Run the audit script via use_figma
- On script failure, fix and retry
- Get target IDs before operating
- Use the batch-update script for large value updates
- Read back with get_variable_defs to verify
- Confirm with the user before deleting
Grouped from the skills themselves: near-identical wordings counted once, and counted by distinct author, so one author publishing three of these counts once. Length counted with cl100k_base; the agent that loads this file may tokenize it differently.