Tailwind カラーパレット

使い方

1. コピー形式を選択 — Tailwind ユーティリティには Class、デザインツールには HEX、CSS 変数には rgb()。
2. スウォッチをクリックして値をコピー。チェックマークが一瞬コピーを確認。
3. 色相（`emerald`）または HEX 断片（`fde0`）を入力してフィルタ。

よくある質問

Tailwind v4 とマッチする？

はい — v4 のデフォルトテーマは v3.4 と同じ色相・シェード値を保持するため、パレットは同一。設定で `theme.colors` をカスタマイズしている場合、プロジェクトのパレットは異なる可能性あり。

なぜグレー系が 5 つも？

Tailwind は slate・gray・zinc・neutral・stone の 5 つのニュートラル色相を提供：slate はクールなブルー寄り、gray はニュートラル、zinc はよりクールでスティールっぽい、neutral は真のニュートラル、stone は暖かい灰褐色。アクセントに最も合うものを選ぶ。

シェード 950 の意味は？

Tailwind は v3.3 で既存の 50〜900 はしごに加えて、より暗い 950 ステップを追加。色相のかすかなヒントを持つほぼ黒 — 深いダークモード背景や非常に微妙なボーダーに有用。

関連ツール