Getting Started

Terrazzo takes DTCG design token JSON and generates code for any platform (e.g. CSS, Sass, JS/TS, and more). You can either run the Terrazzo CLI manually, or as part of your CI process.

tip

Migrating from Cobalt? Check out the Migration Guide

Quickstart

First, install the package using your package manager of choice:

npm i -D @terrazzo/cli

And you can create a configuration and install plugins with the init command:

npx tz init

tz init screenshot

This will create a terrazzo.config.js starter config file, and even start your token system from a popular open source design system.

Comparison

API

CommandDescription
initScaffold out a new project from an existing design system.
buildBuild tokens with your plugins and also run linting.
lintOnly run token linting (not build).
check [file]Validate a given tokens JSON meets the DTCG specification.
--helpDisplay help message.
--silent | --quietSuppress warnings and logs.

Debugging

With any command, set the DEBUG env var to a glob scope (accepts wildcard-match globs):

  • DEBUG=* tz build: debug all scopes
  • DEBUG=parser:* tz build: debug @terrazzo/parser (core)
  • DEBUG=plugin:* tz build: debug plugins

Next Steps