I’ve been delving deep into design token architecture recently and have found some great articles that I wanted to bookmark here for future reference. As I find more, I’ll keep adding to this post.

The guys at SuperFriendly have put together a very thorough list of design token links that I’m still working my way through, but here are a couple of the highlights:

• InVision’s guide to design tokens, as referenced in SuperFriendly’s list, has a useful section on naming design tokens using the category / type / item convention. This is a very scalable way to create a hierarchical naming system for tokens – and, as we all know, naming things is hard! This is the way I’m naming and organising my tokens at the moment.
• Adobe’s Spectrum design system organises their tokens into three main groups – Global, Alias and Component. This mental model works very well for me.

I recently bookmarked a UX Collective article that I found via Brad Frost’s website on naming design tokens. It was a very helpful read and outlines a good framework for hierarchically naming your tokens. In particular, the notes on scales and categorisation are useful.

There’s another alternative take on naming and categorising design tokens, that I found again via Brad Frost, which groups them into two camps – options and decisions (or global and alias). This is an interesting mental model, but I mostly agree with Brad’s take, and what I’ve been discussing here, that there should be a third level for component-specific tokens.