This is a good deep dive into setting up design token architecture.

It largely maps to how we tend to structure things, with some slight language and architectural differences:

  • They use “Option design tokens”; we call them “Tier 1” or “Definition” design tokens. This is where a brand’s token values are defined.
  • They use “Decision design tokens”; we call them Tier 2 or UI application tokens.
  • They also ball Tier 2 (UI application) and Tier 3 (component variables) together. We split them out into separate layers