frontend-tokenslisted
Install: claude install-skill AirMile/claude-config
# Tokens
Manages the full design system: vocabulary tokens (colors, typography, spacing, breakpoints, borderRadius, shadows, base motion, interactions, modes, cssVars) **and** motion packs (animation pack, spring physics, choreography, glass surfaces). Output lives in `.project/project.json → theme`.
**Keywords:** animation, motion, pack, spring, iOS, Apple, Material, Fluent, Carbon, glass, vibrancy, choreography, micro-interactions, easing, playful, transitions, hover, press, entrance, delight, styleguide, PDF, brand intake
**Related skills:** `/frontend-design` · `/frontend-check`
## References — Tokens
- `references/THEME_TEMPLATE.md` — Token categories, naming conventions, JSON schema, Read/Write protocol
- `references/phase-1-action-select.md` — Action selection menus (Tokens + Motion routes)
- `../shared/DASHBOARD.md` — project.json full schema
- `../shared/DESIGN.md` — Color advice, typography, motion anti-patterns, glass surface rules
- `../shared/BACKLOG.md` — Backlog lifecycle protocol
- External: `vercel-labs/web-interface-guidelines` — setup-context for Create route (see `references/route-create.md § Step 0`)
## References — Motion
- `references/motion/packs.md` — Pack definitions + source credits (source of truth)
- `references/motion/route-create.md` — Pick pack
- `references/motion/route-customize.md` — Axis-by-axis customisation
- `references/motion/route-apply.md` — Emit CSS vars to codebase
- `references/motion/ios-easings.md` — Apple iOS/macOS easing