TOKEN ★ ADVENTURE // arcade dev cabinet

PLAYER 1

000000

HIGH SCORE

12800000

SECTOR

01-A

▶ INSERT COIN · WAVE 01 INCOMING

TOKEN ADVENTURE

— a coding arcade in deep space —

You are the pilot. Each sector teaches one piece of the W3C Design Tokens Format spec — from naming a single decision, through groups, aliases, and composite types, to wiring a tokens.json into a real UI and auditing a broken library. Clear the wave, log the intel, level up your rank.

▶ PRESS START STAR CHART
  • 8 SECTORS
  • 01 WORLD
  • ∞ CREDITS
  • 0 CLEARED

— WORLD 1 · MISSION SELECT —

THE TOKEN BELT

Eight sectors charting the W3C Design Tokens Format — naming decisions, groups, aliases, types, composites, and the build pipeline that ships them to a UI.

  1. SECTOR 01 · BEGINNER The Hardcoded Hellscape Why design tokens exist READY · ENGAGE
  2. SECTOR 02 · BEGINNER The Registry Awakens tokens.json — $value and $type READY · ENGAGE
  3. SECTOR 03 · BEGINNER Forge a Group Groups, $type inheritance, $description READY · ENGAGE
  4. SECTOR 04 · INTERMEDIATE Echoes & Aliases Aliases / token references READY · ENGAGE
  5. SECTOR 05 · INTERMEDIATE Types of the Realm W3C token types & canonical value formats READY · ENGAGE
  6. SECTOR 06 · INTERMEDIATE Composite Constructs Composite tokens — typography READY · ENGAGE
  7. SECTOR 07 · EXPERT The Translation Pipeline From tokens.json to CSS custom properties READY · ENGAGE
  8. SECTOR 08 · EXPERT Audit the Library Spotting and fixing W3C-spec violations READY · ENGAGE