UUUP Tools

デザインツール

CSS名前付きカラー - 標準色名リファレンス

W3C / CSS の named color とその値を一覧できます。keyword や family で絞り込み、標準 color name や HEX をコピーして素の CSS 実装に使えます。

クイック切替→Tailwindカラーチートシート
CSSColorCheat sheet
クイック切替:Tailwindカラーチートシート

このツールをお気に入りに

お気に入りの保存方法がまだ選ばれていません。

クイック操作

デザインツールに戻る すべてのツールを見る

このツールの URL をコピーするか、対応端末ではシステムの共有シートを開けます。

利用シーン

  • 素の CSS で使う標準 color name を選ぶ
  • color name と HEX 値を対応付けて確認する
  • light / dark 系の family を keyword で絞り込む

使い方

  1. board を一覧するか keyword / family で絞り込む
  2. swatch をクリックして詳細を見る
  3. 必要な形式で name または HEX をコピーする

入出力サンプル

クリック

cadetblue

取得

cadetblue (#5f9ea0)

FAQ

これは Tailwind の palette ですか？

いいえ。これはブラウザ標準の CSS named color 一覧で、Tailwind の scale system ではありません。

すべての browser が全色名をサポートしますか？

現代的な browser は標準 set をサポートしますが、ブランド上厳密な色指定には明示的な HEX / RGB を推奨します。

ツール

関連ツール

近い用途の翻訳済みツールへ続けて進めます。

Tailwindカラーチートシート

Tailwindカラーチートシート - フルスケール配色ボード

利用可能

Tailwind CSS の配色スケール（50〜950 を含む）を 1 画面で確認できます。名前、スケール、HEX で検索し、utility class 名や生の HEX 値を CSS プロジェクト向けにコピーできます。

Design Tailwind CSS
ツールを開く