Tokens Studio has enabled exports that align closer with the W3C DTCG format. This means you are able to import them into the zeroheight design token manager - however there are a few caveats to be aware of as part of the update.

How to import Tokens Studio tokens into zeroheight

1. You will first need to make sure that your tokens are in the W3C DTCG format, instead of the legacy format.
   • Head to the Settings tab

     

   • If it says "Legacy format", click to update it and hit "Convert"

     

2. You should then export your tokens either as a JSON file, to GitHub or GitLab.
3. Then you will be able to follow the normal flow to import your tokens into zeroheight.

How to make Tokens Studio compatible with zeroheight

Multi-file token sets

zeroheight is only compatible with single file token sets. Therefore, when you export from Tokens Studio make sure you have selected the "Single file" option.

Cross-set aliases

When you use an alias from a different set within Tokens Studio, the value in the JSON file is incomplete and therefore currently incompatible with zeroheight.

We recommend only aliasing within the same token set. Otherwise, as long as you have exported all the token sets in a single file, you will need to update the value of your tokens to include the parent token set name. For example:

{
  "global": {
    "red": {
      "$value": "#f00",
      "$type": "color"
    }
  },
  "Light": {
    "child_red": {
      "$value": "{global.red}",
      "$type": "color"
    }
  },
  "$themes": [],
  "$metadata": {
    "tokenSetOrder": [
      "global",
      "Light"
    ]
  }
}

Values not abiding to the W3C DTCG format

It is still possible to create tokens that have values which are incompatible with the W3C DTCG format. These will be called out when you trying to import into zeroheight.

For example, it is still possible to create typography types that are missing a valid unit. You will need to manually update these.