Colour Name Finder

色彩命名・配色解析エンジン

美学と機能性の融合

色名検索ツール & 配色パレットエンジン

プロ仕様の高精度カラー分類インターフェース。CIELAB色空間のDelta E計算式により、人間の視覚認知に極めて忠実な判定を実現。100%ブラウザ内完結・オフライン対応・安心のプライバシー。

判定モード:
円をクリックして自由な色を選択
#
RGBスライダー
R121
G40
B202
知覚的一致99.8% 一致率

パープルハート

HEX
#7928ca
RGB
121, 40, 202
HSL
270°, 67%, 47%
CMYK
40%, 80%, 0%, 21%
デザイナー向けプロTips

画面の発色精度を正確にキャリブレーション

ウェブと印刷物で妥協のない正確な発色を実現。プロのデザインワークに最適なキャリブレーション対応4Kモニターをご紹介します。

Amazonで4Kモニターを見る広告告知: Amazonアソシエイト・プログラムの参加者として、適格販売により収入を得る場合があります。
最近の検査履歴
最近の検査履歴はありません。

色彩ハーモニー(配色調和)

色相環の幾何学的配置に基づく美しい配色スキームの自動生成。

補色 (Complementary)色相環で反対側に位置する対照的な組み合わせ(180°回転)。
類似色 (Analogous)色相環で30°間隔で隣接する調和のとれた自然な組み合わせ。
トライアド (Triadic)色相環を120°等分する正三角形の3色配色。
スプリット・コンプリメンタリー基準色とその補色の両隣の2色を組み合わせた配色。
テトラード (Tetradic)2組の補色からなるバランスの取れた4色配色。

グラデーション階調 & コントラスト監査

明度・彩度の段階的展開およびWCAGウェブアクセシビリティ監査。

シェード / Shades(黒を加えた暗色)
ティント / Tints(白を加えた淡色)
トーン / Tones(グレーを加えた中間色)

コントラスト比監査。

テキストの読みやすさに関するWCAGウェブアクセシビリティ推奨基準を満たしているかを検証します。

白文字 (#FFFFFF)--
通常サイズのテキストサンプル大きめの太字テキストサンプル
通常テキスト AA基準 (4.5:1)--
通常テキスト AAA基準 (7.0:1)--
大きなテキスト AA基準 (3.0:1)--
大きなテキスト AAA基準 (4.5:1)--
黒文字 (#000000)--
通常サイズのテキストサンプル大きめの太字テキストサンプル
通常テキスト AA基準 (4.5:1)--
通常テキスト AAA基準 (7.0:1)--
大きなテキスト AA基準 (3.0:1)--
大きなテキスト AAA基準 (4.5:1)--

色名辞典

厳選された1,500以上の色名、日本の伝統色、歴史的絵具、Webセーフカラーを検索できます。

全1,566色を表示中
データベースを読み込み中...
プラットフォームの特長

色彩分析を極める充実の機能群

妥協のない精度で色を抽出し、変換し、検証し、調和させるオールインワンツール。

多彩な入力方法

HEXコードの直接入力、RGB/HSLスライダー、画像アップロード、スマホカメラ撮影に対応。

1,500色以上の大辞典

CIELAB Delta E色差式を用いて、目視に最も忠実な標準色名を瞬時に特定。

即時フォーマット変換

HEX、RGB、HSL、CMYKの各色空間の値をリアルタイムに相互変換。

美しい配色パレット生成

補色・類似色・トライアドなど、デザインの現場ですぐに使える調和配色を自動生成。

アクセシビリティ検証

WCAG 2.1のAAおよびAAA基準に適合しているかをワンクリックで監査。

履歴保存とワンクリックコピー

ブラウザ内に直近の検査履歴を安全に保存し、各種コードを素早くコピー。

ナレッジベース & ガイド

色名検索ツールの完全活用ガイド

知覚的カラーマッチング、HEXコード変換、画像色彩分析がデザインワークをどう変えるかを解説します。

1. なぜ高精度な色名検索ツールが必要なのか

色彩は視覚伝達やブランディングの中核です。しかしデザイナーが呼ぶ「空色」とエンジニアが扱う「#87CEEB」の間には認識のズレが生まれがちです。専用の色名検索ツールはこのギャップを埋める共通言語となります。

本ガイドでは、色名の成り立ちや、なぜ従来のRGB幾何学距離よりも人間の感覚に即した知覚距離が優れているのかを詳しく解説します。

2. 色の解剖学:HEXコードと人間の知覚モデル

HEXコードはブラウザにとって理想的ですが、人間にとっては直感的に色名をイメージできません。

従来のツールは単純なRGB空間の計算を行うため、人間が緑や黄色に極めて敏感であるという視覚特性を無視してしまい、結果に違和感が生じます。

当ツールは人間の視覚に均等なCIELAB色空間とDelta E(CIEDE2000)計算式を採用しており、人間の目で見て最も自然に一致する色名を表示します。

3. 写真やイラストから瞬時に色名を特定する

デザインのヒントは写真やアートから生まれます。画像をアップロードすれば、拡大ルーペで1ピクセル単位の色名とHEXコードを瞬時に抽出できます。

  • 完全ローカル解析: 画像データは外部サーバーに一切送信されず、端末内で安全に完結します。
  • 高精度ルーペ機能: カーソル位置のピクセルをリアルタイムで拡大表示します。
  • ワンクリック色名判定: 気になるピクセルをクリックするだけで正確な色名を表示します。
  • 主要色パレット抽出: クラスタリング解析により、画像全体の代表的なカラーを自動抽出します。

4. HEXコードによる検索と逆引き

手元にあるHEXコードを貼り付けるだけで、正式な色名やRGB/HSL/CMYKの換算値を瞬時に確認できます。

5. PWAによるオフライン動作対応

最新のプログレッシブウェブアプリ(PWA)として構築されており、PCやスマートフォンにインストールして通信環境がない場所でも動作します。

6. マッチングアルゴリズムの技術的詳細

入力されたRGB値をCIE XYZを経てCIELAB空間のL*(明度)、a*(赤緑)、b*(黄青)に変換し、CIEDE2000規格で差分を最小化します。

7. デザインシステムへの実務的導入

デザイントークンに自然な名前を与え、CSSコードの可読性を向上させ、WCAGアクセシビリティ要件をクリアできます。

よくある質問

よくある質問(FAQ)

色名検索や色彩アルゴリズムに関する疑問に分かりやすくお答えします。

色名検索ツールの使い方は?

#7928caなどのHEXコードを入力するか、スライダーを動かしてください。1,500以上の色名データベースからCIELAB Delta E計算式で最も近い色名を表示します。画像アップロードやカメラスキャンも利用可能です。

見えている色はどうやって調べればいいですか?

HEXコードを入力するか、写真をアップロードしてルーペでピクセルをクリックするか、スマホのカメラで実物をスキャンして判定できます。

色の名前はどのように決められているのですか?

数値データを標準的な色名データベースと照合します。人間の知覚に忠実なCIELAB色空間を用いることで、肉眼で見た感覚と一致する名前を導き出します。

相性の良い組み合わせ(配色)はどう探しますか?

補色・類似色・トライアドなどのハーモニー機能や、明度変化(ティント/シェード/トーン)、色名辞典の系統別ブラウズを活用してください。

カラー特定(カラー同定)とは何ですか?

RGBやHEXなどの技術的数値を、人間が理解できる標準的な名称に変換する処理のことです。CIEDE2000などの精密な色差計算が用いられます。

判定された名前が正確かどうか分かりますか?

完全に一致する場合は「完全一致」バッジが表示されます。中間色の場合は「98%一致」のように知覚的類似度が表示されます。

プログラマー専用のツールですか?

いいえ!デザイナー、イラストレーター、マーケター、画家、ネイリスト、一般の色彩愛好家まで、どなたでも便利にお使いいただけます。

専門知識がなくても使えますか?

はい、直感的なビジュアルインターフェースなので、コードの知識がなくても誰でも簡単に使えます。