[tech-seed] Tailwind CSS v4 の @theme で設計するデザイントークン
- 公開日
- 更新日
Tailwind CSS v4 で CSS-first の @theme 構文が導入されました。従来の tailwind.config.js ベースから移行する際の段階手順と、デザイントークンとしての CSS 変数定義を実例で示します。
マルチテーマ(data-site 属性での切替)や prefers-color-scheme への対応もシンプルにまとまります。
Tailwind CSS v4 で CSS-first の @theme 構文が導入されました。従来の tailwind.config.js ベースから移行する際の段階手順と、デザイントークンとしての CSS 変数定義を実例で示します。
マルチテーマ(data-site 属性での切替)や prefers-color-scheme への対応もシンプルにまとまります。