ドキュメントアセットとして登録したカラーや文字スタイルには名前を付けることができます。この名前はデザイントークンと呼ばれ、開発者がスタイルに対応する変数やクラスを作成する際に使用します。そのため、命名規則を事前に合意しておく必要があります。
デザイントークンを指定するには、ライブラリパネルを開き、アセットのデフォルト名をダブルクリックして、新しい名前を入力します。
作成したデザイントークンは、デザインスペックを公開して開発者に共有します。共有モードで「表示設定」ドロップダウンから「開発」を選択し、書き出し先に「Web」を選択してから、「リンクを作成」をクリックします。リンクが生成されたらコピーして開発者と共有します。ブラウザーで共有リンクを開き、「</>」をクリックすると、カラーや文字スタイルごとに対応するデザイントークンが表示されます。
デザイントークンを使用したCSS コードスニペットをダウンロードするには、「{ } 」をクリックして変数を表示し、「CSS をダウンロード」をクリックします。ダウンロード後、スニペットをコピーして実装コードに貼り付けます。