token-architecture
Installation
SKILL.md
Token architecture
When to use
Use when a design value affects more than one component, theme, or platform, or when Figma/Paper values disagree with code tokens. For a single screen implementation, begin with design-to-code-handoff; this skill handles the token decision within that workflow. Do not introduce a new tier system merely because the current naming differs from an example.
Establish the source of truth
- Read the repository's design-system docs, token files, generated outputs, theme code, and any Figma variable mapping. Identify the actual source of truth and its owner; do not assume Figma or code always wins. Distinguish authored files from generated files and do not edit generated output directly.
- Inventory consumers: CSS custom properties, Tailwind configuration, component styles, Storybook stories, native outputs, and design variables where present. Record which are in scope and which cannot be inspected.
- Capture the exact design source and revision or timestamp, relevant mode, token name, value, and usage. A screenshot color sample is an approximation, not a verified token reference.
Decide the smallest change
| Design use and source | Existing semantic token | Consumers and modes | Decision | Owner and unresolved difference |
|---|