← All termsGLOSSARY / Design
Design Token.
デザイントークン
色・余白・文字サイズなどの設計上の決定を、再利用できる名前付きの値として管理する仕組み。
たとえば画面に使う青を「#3456FF」と各所に直接書く代わりに「color.action.primary」という名前で参照する。値の変更を一カ所に集約でき、Web・アプリ・デザインツール間でも意味を揃えやすい。トークンは単なる色見本ではなく、デザイン上の意図と実装を橋渡しするインターフェースである。
ただし、命名規則が曖昧なまま数を増やすと、どの値を選ぶべきか分からなくなる。基礎的な値と用途を表す値を分け、変更の影響範囲を理解したうえで運用することが重要になる。
実装時にはトークンの値だけでなく、廃止予定の名称や移行手順も管理したい。古い参照が残ると、変更したはずの色や余白が一部の画面だけ変わらない事態が起きる。
Blueberry’s Perspective
色の名前をつけるのではなく、色を使う理由に名前をつけたい。その違いが運用のしやすさを決める。