Brand Color System Generator — Design Tokens & Typography

デザインシステムとは、アプリケーションを一貫して構築するための、標準、ドキュメント、原則、およびツールキット（UIパターンやコードコンポーネント）を包括的にまとめたものです。

コアとなるHEXカラーの色温度、エネルギー、重みをプロファイリングし、アルゴリズムによるハーモニー戦略（スプリットコンプリメンタリーや類似色など）を適用して、アクセシブルなアクセントカラーとサーフェスカラーを自動的に導き出します。

ブランドカラーを表すセマンティック変数です。エクスポートされたJSONを、Tailwind CSSの設定、Figma Variables、または標準のCSSスタイルシートに直接注入できます。

純粋な黒（#000000）は現実世界ではほとんど存在せず、画面では目の疲れを引き起こします。そこで、高いWCAGコントラストを維持しながら、有機的で統合された印象を与える、色味を帯びた「On Surface」トーンを生成しています。