Color Picker

画像をクリックして、その位置の色をHEX・RGB・HSLで取得します。

入力データはブラウザ内で処理されます
データはサーバーへ送信されません

変換ツール

画像ファイルをドラッグ&ドロップ

画像はブラウザ内で処理され、サーバーへは送信されません。

Color Pickerとは?

Color Pickerは、アップロードした画像上をクリックするだけで、その位置の色をHEX・RGB・HSLの3形式で取得できるツールです。 取得した色はワンクリックでクリップボードにコピーでき、履歴からも過去に選んだ色を再利用できます。

すべての処理はブラウザ内のCanvas APIで完結し、画像データが外部サーバーへ送信されることはありません。

利用シーン

  • デザインカンプの画像から使われている色を特定したい
  • ロゴやブランドカラーのHEXコードを調べたい
  • Webサイトのスクリーンショットから配色を確認したい

使い方

  1. 画像ファイルを選択、またはドラッグ&ドロップします。
  2. 色を知りたい位置をクリックします。
  3. HEX・RGB・HSL形式の値が表示されるので、クリックしてコピーできます。
  4. これまでに取得した色は履歴として一覧表示され、いつでも再コピーできます。

よくある質問

このツールは無料ですか?

はい、完全無料でご利用いただけます。

画像はサーバーに送信されますか?

いいえ、すべての処理はお使いのブラウザ内で行われます。画像がサーバーへ送信されることはありません。

どの色形式に対応していますか?

HEX(例: #ff6600)、RGB(例: rgb(255, 102, 0))、HSL(例: hsl(24, 100%, 50%))の3形式に対応しています。

透過画像の透明部分もクリックできますか?

透明部分をクリックした場合、背景色との合成結果ではなくその位置のピクセル値がそのまま取得されます。