Tailwind CSS設定生成ツール

このツールは、簡単なフォームでそのまま使える Tailwind CSS の設定ファイルを作成し、JavaScript を手書きする手間を省きます。クラスのプレフィックスを設定し、important フラグを切り替え、Tailwind が走査すべき content パスを並べます。カスタムカラーやフォントファミリーを追加でき、ジェネレーターがそれらをきれいな theme.extend ブロックにまとめます。すべてが 1 つの tailwind.config.js にまとまり、プロジェクトへそのままコピーできます。

1. 基本タブで、プレフィックス、important フラグ、content パスを設定します 2. カラータブで、各カスタム色の名前と値を追加します 3. フォントタブで、各フォントファミリーとカンマ区切りのスタックを追加します 4. 出力タブを開き、生成をクリックします 5. ファイルを確認し、プロジェクトにコピーします

content パスは 1 行に 1 つずつ書き、Tailwind が正しいファイルを走査してクラス名を集められるようにします。カスタム色は bg-primary や text-brand のようなユーティリティクラスになり、フォント項目は font-sans など任意の名前になります。空のセクションは自動で省略されるため、色やフォントだけを埋めても生成ファイルは整います。出力は先頭に Tailwind の型ヒントを付けたモダンな ESM エクスポート形式です。