Tiny Online Tools logoTiny Online Toolssearchツールを検索…grid_viewすべてのツール
ホームchevron_rightデザインツールchevron_rightTailwind カラー生成ツールTailwind カラー生成ツール

Tailwind カラー生成ツール

ベースカラーから Tailwind CSS のカラースケールを生成します。

関連ツール

HEX → Tailwind 変換ツール

HEX → Tailwind 変換ツール

HEX カラーを最も近い Tailwind CSS カラークラスに変換します。

CSS 変数生成ツール

CSS 変数生成ツール

カラーやデザイン寸法用の CSS カスタムプロパティ(変数)を生成します。

CSS Clip-Path ジェネレーター

CSS Clip-Path ジェネレーター

ライブプレビューでCSS clip-path形状を生成します。

CSS Grid ジェネレーター

CSS Grid ジェネレーター

ライブプレビューを見ながらレスポンシブな CSS Grid レイアウトを作成できます。

PDF 画像抽出ツール

PDF 画像抽出ツール

PDF に埋め込まれた元の画像を取り出します。JPEG はバイト単位でそのまま、その他は PNG で。実寸・配置サイズ・実効 DPI も表示します。

GIF にテキストを追加

GIF にテキストを追加

アニメ GIF の各フレームにカスタムテキストを重ねます。サイズ、色、輪郭、位置を調整可。

PDF メタデータ表示

PDF メタデータ表示

著者、日付、寸法などを含む PDF の詳細なメタデータを表示します。

apps

もっと見る

無料オンラインツールの全コレクションを見る。

Tailwind カラー生成ツール

Tailwind カラー生成ツールは、1色のベースカラーから Tailwind CSS 用の完全なカラースケールを生成します。

このツールが役立つ場面

  • Tailwind プロジェクト用のカスタムカラーパレット作成
  • 任意の色に対して 50 〜 950 のスケールを生成
  • tailwind.config で使うカラー値のエクスポート

典型的なワークフロー

  1. ベースカラーを入力します。
  2. 明から暗への生成スケールを確認します。
  3. Tailwind 設定ファイル用のコードをコピーします。