デザインシステムライブラリ用Tailwind Config

デザイントークン、テーマコントラクト、コンポーネントプリセット、チーム間の一貫したAPIでTailwind CSS上にスケーラブルなデザインシステムを構築します。

Framework

詳細な説明

デザインシステム用Tailwind

デザインシステムライブラリを構築する際、Tailwind設定はすべてのデザイントークンの単一の真実のソースになります。

デザイントークンアーキテクチャ

トークンを別ファイルで定義し、設定でインポートします。

CSS変数ブリッジ

ランタイムテーマ設定(例:複数ブランド)には、CSS変数を使用します。

厳格モード

承認済みのトークンのみを強制するために、拡張ではなく上書きします。

配布

設定をnpmパッケージとしてエクスポートし、消費アプリケーションでTailwindプリセットとして使用します。

ユースケース

複数のチームやアプリケーションが一貫したスタイリングのために消費する共有デザインシステムライブラリを構築する際にこのパターンを使用してください。

試してみる — Tailwind Config Builder

フルツールを開く