CSS → Tailwindコンバーター
任意のCSSをTailwind CSSユーティリティクラスに即時変換 — 完全なプロパティマッピング、任意値、マルチセレクターサポート、一括変換
CSS → Tailwindコンバーター について
任意のCSSをTailwind CSSユーティリティクラスに即時変換します。完全なプロパティマッピング、任意値、マルチセレクターサポート、一括変換に対応しています。
CSS → Tailwindコンバーター の使い方
- 1入力パネルにCSSコード（単一セレクターまたはスタイルシート全体）を貼り付けます。
- 2「変換」をクリックして各セレクターの同等のTailwindクラスを確認します。
- 3出力をレビューします。プロパティは完全一致、近似、任意値、未サポートとしてマークされます。
- 4生のクラス、JSX className、HTML class属性として出力をコピーします。
- 5一括モード（Starter以上）を使用して、/* --- */で区切った複数のCSSブロックを変換します。
ヒント
- 任意値（例：w-[137px]）は正確なTailwindユーティリティがない場合に使用されます。標準値に丸めることを検討してください。
- 複数セレクターのスタイルシート全体を貼り付けられます。ツールがすべてを一度に処理します。
- Reactで作業する場合はJSXコピーモードを使用してください。classNameシンタックスでクラスをラップします。
無料 vs 有料の制限
無料：変換ごとのプロパティ数制限あり。Starter以上：無制限プロパティ、一括モード。
OneKitTools チーム更新日 2.21.4