HEXカラーを色名に変換
HEXカラーの名前を調べます。HEXコード（#RRGGBB、#RGB、#の有無は問いません）を入力すると、RGBのユークリッド距離で最も近いCSSの色名、完全一致かどうか、近い色名の順位付きリストが得られます。
入力
#FF5733、FF5733、#F53、F53 などのHEXカラーコード（#の有無は問いません）。
最も近いCSSの色名を何件表示するかを指定します。
出力
HEXがCSSの色と完全に同じ場合は「Exact match」、それ以外は「Closest match」と表示されます。
| 色名 | HEX | RGB | 距離 |
|---|---|---|---|
| No data yet | |||
このツールを使う他の方法
REST API
curl -X POST https://api.iotools.cloud/v1/tool/hex-color-to-name \
-H "Authorization: Bearer YOUR_API_KEY" \
-H "Content-Type: application/json" \
-d '{
"hexColor": "#FF0000",
"matchCount": "5"
}'ご自身のアカウントのキーに差し替えてください。ツールのフィールドがそのままリクエストボディになります——ラッパーはありません。
AIエージェントに依頼する
Use the IOTools `hex-color-to-name` tool (HEX Color to Name) on this input:
YOUR_INPUT_HEREIOTools MCPサーバーに接続された任意のエージェントにこれを貼り付け、入力内容を追加してください。
埋め込みウィジェット
<iframe
src="https://iotools.cloud/embed/hex-color-to-name/"
width="100%" height="520" frameborder="0" scrolling="no" loading="lazy"
title="HEXカラーを色名に変換 — iotools.cloud"
sandbox="allow-scripts allow-forms allow-same-origin allow-downloads allow-popups allow-popups-to-escape-sandbox"
allow="clipboard-write"
style="width:100%;border:1px solid #e5e7eb;border-radius:12px;overflow:hidden"></iframe>
<script src="https://iotools.cloud/embed.js" async></script>ご自身のページに貼り付けるだけ——無料、キー不要、リンクを掲載するだけです。
| API/MCP 1回あたりの費用 | 5クレジットから |
|---|---|
| クレジットが足りませんか? | 料金を見る |
次の方法でも利用可能
ガイド
HEXコードを色名に変換
#6395EE のようなHEX値があって、それを何と呼べばいいのか迷ったことはありませんか？
このツールは任意のHEXカラーコードを受け取り、最も近いCSSの色名を見つけます。
red、tomato、cornflowerblue のような、ブラウザがそのまま理解できる分かりやすいキーワードです。
コードを貼り付けるだけで、最も近い色名、完全一致かどうか、そして元の色に近い色の短いリストが得られます。
このツールはすべてお使いのブラウザ内で動作します。入力した内容がアップロードされたり記録されたりすることはありません。
使い方
- 入力欄にHEXカラーを入力します。
#FF5733、FF5733、3桁の省略形#F53やF53など、一般的な形式はすべて使えます。先頭の#の有無は問いません。 - 必要に応じて、近い色を何件表示するか（1〜10）を選びます。
- 結果を確認します。最も近い色名、Exact match / Closest match のバッジ、そして近いCSS色のHEX・RGB・距離を示す表が表示されます。名前をコピーするか、一覧全体をCSVでダウンロードできます。
最も近い色の計算方法
このツールは、お使いの色を標準のCSS3 / X11の名前付き色140色と比較します。color: teal と書いたときにブラウザが解釈するのと同じ一覧です。各色名には、仕様で定められた正確なRGB値があります。
照合には RGB空間におけるユークリッド距離 を使います。各色を (R, G, B) の点とみなし、お使いの色と名前付きの色ひとつひとつとの直線距離を計算します。
distance = √( (R₁−R₂)² + (G₁−G₂)² + (B₁−B₂)² )距離が最も小さい色名が選ばれます。距離が 0.00 の場合、HEXがそのCSS色と完全に同一であることを意味し、Exact match と表示されます。それ以外は Closest match となり、距離の数値がどれくらい離れているかを示します。小さい値（おおむね10未満）は見た目にほとんど区別がつかず、大きい値になるほど明らかに違う色合いになります。
なぜRGBの距離を使うのか？
RGBのユークリッド距離は高速で分かりやすく、決定論的です。同じ入力からは常に同じ結果が得られます。「この色は何と呼べばいいか」を調べる標準的な方法です。各チャンネルを同じ重みで扱うため、人間の視覚を完璧にモデル化したものではありませんが、固定された140件のパレットから色名を選ぶには十分な精度があります。また、順位付きのリストを見れば、ほかの候補も自分で比較できます。
完全一致とは何ですか？
HEXコードがCSS色の正規の値と厳密に一致する場合のみです。たとえば #FF0000 は正確に red、#2E8B57 は正確に seagreen です。#00FFFF は aqua に一致します（同じ値を持つ別名 cyan は、一覧の後ろに置かれています）。
よくある質問
オフラインでも使えますか？
はい。140色の値と照合の計算はすべてページに含まれており、クライアント側で実行されます。そのためネットワーク接続がなくても動作し、入力内容も外部に送られません。
逆方向に、色名からHEXコードを調べることはできますか？
このツールはHEX → 色名の変換のみを行います。結果の表には各候補のHEXとRGBが表示されるため、頭に思い浮かべた色名が結果の中にあるかを照らし合わせて確認することもできます。
どの形式を貼り付けられますか？
6桁のHEX（#RRGGBB）と、3桁の省略形（#RGB、各桁を2回繰り返して展開します）のどちらも使えます。どちらも先頭の # の有無は問いません。有効なHEXでない入力は、分かりやすいメッセージとともに拒否されます。