色名ファインダー
任意の色の値に最も近い名前付きCSS色を検索します。任意のCSS形式で100色まで貼り付けると、それぞれについて148個のCSS名前付き色をCIEDE2000の色差順に表示します。色名、16進コード、Delta E値、一致度も確認できます。各色につき最大10件まで表示します。デザイントークンの命名、ドキュメントでの色の説明、手早いキーワード探しに便利です。
よくある質問
どの色名が検索対象ですか？
148色はCSS Color 4の名前付きカラーで、aliceblueからyellowgreenまで、rebeccapurpleも含まれます。aquaとcyan、fuchsiaとmagenta、grayとgreyのように値が同じ名前は1行にまとめられるため、異なる色は139色です。transparentとシステムカラーは含まれません。
最も近い名前はどのように測定されますか？
culoriライブラリでCIELABを用いて計算したCIEDE2000色差、Delta E 2000を使用します。これは平均的な観察者にとって2色がどれほど異なって見えるかを示す業界標準です。値が小さいほど、より近い色です。
一致度の評価は何を意味しますか？
「完全一致」は、名前付きカラーのHEXコードが同じであることを意味します。「非常に近い」はDelta Eが2未満で、見分けるのが困難です。「類似」は5未満で、並べると違いがわかります。「遠い」は5以上で、名前は色の大まかな系統を示すだけです。
一致候補はいくつ表示されますか？
色ごとに1〜10件で、初期設定は3件です。近い順に表示されます。最も近い名前の明度は合っていても色相が違う場合や、その逆の場合は、候補を増やすと役立ちます。
色を入力するにはどうすればよいですか？
1行に1色ずつ入力するか、1行に複数の色を入力し、カンマまたはセミコロンで区切ってください。rgb()またはhsl()内のカンマは区切りとして扱われません。#の有無を問わずHEXコード、CSS色名、rgb()、hsl()、hwb()、lab()、lch()、oklab()、oklch()、color()、cmyk()を使用でき、1回につき最大100色まで入力できます。
透明色はどうなりますか？
名前付きカラーは不透明なため、アルファ値は無視され、完全に不透明な色として比較されます。HEX列には比較に使用した6桁のコードが表示されます。
広色域の色はどう扱われますか？
鮮やかなDisplay P3やOKLCHの値など、sRGBの範囲外の色は、まずCSS Color 4のアルゴリズムでsRGBに変換されます。CSSの名前付きカラーはすべてsRGBの色だからです。HEX列には変換後の値が表示され、その値を名前と比較します。
HEXコードの代わりに名前を使えますか？
完全一致する場合に限り使えます。それ以外の場合、名前付きカラーは見た目が異なります。近い名前でも、steelblueに近い青のように、デザイントークンやドキュメントで人が読みやすいヒントとして役立ちます。
なぜ名前はCSS個だけで、もっと多くないのですか？
CSSの名前は、すべてのブラウザーが認識し、スタイルシートに直接入力できるものです。より大きな名前の一覧は提供元によって異なり、ライセンスが必要な場合もあります。一方、これらの148の名前はCSS標準で定義されています。
Delta Eが高い候補のほうが近く見えることがあるのはなぜですか？
Delta E 2000は、標準的な観察条件下での平均的な観察者をモデル化しています。ディスプレイやその調整状態、周囲の色、個人の色覚によって最も近く見える色は変わるため、順位は有力な目安として使い、絶対的なものとは考えないでください。