← すべてのテキストツール

Tailwindカラーパレットジェネレーター

ブランドカラーから、v3またはv4用の50〜950のTailwind CSSカラースケールを作成します。

  • 無料
  • 登録不要
  • どの端末でも使える

約Tailwindカラーパレットジェネレーター

ブランドカラーを入力すると、Tailwindで使われる形式の50から950までの全段階が得られ、v3の設定ファイルやv4のテーマ変数にそのまま使えます。明るい段階は背景に向き、500がおおよその基本色で、最も暗い段階はテキストやダークモードに使えます。

Tailwindカラーパレットジェネレーターの使い方

  1. 上でオプションを設定します。結果はリアルタイムで更新されます。
  2. 納得がいくまで自由に調整します。
  3. 結果をコピーするか、ダウンロードします。

このツールを使う理由

別名

よくある質問

生成されたTailwindの色はどこに貼り付ければよいですか?

v3では、tailwind.config.jsのtheme.extend.colorsの下に追加します。v4では、CSSファイルの@themeブロックに変数を貼り付けます。

Tailwindカラーパレットジェネレーターは無料ですか?

はい。ToolipediaのTailwindカラーパレットジェネレーターは無料で、登録不要、透かしもありません。

安全に使えますか?

はい。すべての計算はブラウザ内で行われ、入力した内容が当社サーバーに送信されることはありません。

スマートフォンでも使えますか?

はい。AndroidやiPhoneの最新ブラウザのほか、タブレットやパソコンでも使えます。インストールは不要です。

アカウントは必要ですか?

いいえ。ページを開いてツールを使うだけです。登録もメールアドレスも不要です。

関連ツール