$ npm i $ npm run build

Usage no npm install needed!

<script type="module">
  import testDt from 'https://cdn.skypack.dev/test-dt';



Getting Started

$ npm i
$ npm run build

You should have built less/scss files in the dist directory.

Code Guide

The src directory has code to compute derived tokens.

The tokens directory has the design tokens.

The scripts directory has a simple script to read in the colors.json token file and create the colors-derived.json token file with the code from the src directory.


  • Style Dictionary vs Theo
    • Style Dictionary download count has grown to be comparable to Theo
    • Theo has a public documented js api that can take a string instead of a file path. Style Dictionary doesn't seem to have a documented one.
  • Token format could use JSON5 to be closer to the derived token syntax in the src directory.
  • Use prettier for formatting the tokens, src, and scripts directories.