はじめに こんにちは。DTダイナミクスでフロントエンドの切削サービスの開発をしております、朱です。 本記事では、色定義が散らばっていた状態からデザインシステム化の足がかりとしてカラートークンを整備した背景とその内容をまとめました。 そして運用で起きやすいタイポ/未定義トークン混入に対し、トークンの整合性(定義済みのみが使われる状態)を保つために試したことについても共有します。 背景:なぜ今「トークン化」なのか UIの色は、プロジェクトが育つほど「定義の置き場所」が増えがちです。 HEXの直書き、SCSSのカスタム変数、コンポーネント固有の色が混在してくると、変更時に「どこで使われているか」とい…