Deep Dive on Design Tokens

Introduction Slides

In this workshop we will create a design token package along with demo applications in Android, iOS, Web, and Flutter. This is a live-coding workshop, but you don't need to be writing code as we go. The coding part is a tool to explain concepts about design tokens. Also, all of the steps and content that will be covered in this workshop are available online on this site at Each step and the final result of this workshop are available in the Github repository in branches.

If you do want to code-along in the workshop, you will need a few things set up first:

  • Git
  • A text editor or IDE. I will be using VSCode for most of it (and switching to Xcode and Android studio when needed)
  • Node and npm
  • optional Android Studio and an Android simulator if you want to build the Android demo
  • optional Xcode 11 or greater if you want to build the iOS demo

Recording from Clarity 2020