画像カラーピッカー
画像や画像URLからカラーコードを抽出します
特徴
クリックで瞬時に色抽出
画像の任意の位置を押すだけで色を取得
5形式のカラーコード対応
HEX・RGB・HSL・HSV・CMYKを同時表示
25〜400%の拡大表示
細部の色も拡大とドラッグ移動で正確に取得
画像URLからも読込可能
ファイルだけでなくURL指定でも色を抽出
使い方
画像ファイルかURLを読込
ファイルを選択するか画像URLを入力して読み込む
拡大率の調整とドラッグ
プラスマイナスボタンで25〜400%に拡大し位置を移動
色をクリックで取得
画像上の目的の位置をクリックしその色を抽出
カラーコードをコピー
HEXなど各形式の値をコピーボタンで取得
ユースケース
Webデザインの配色
参考画像から色を抜き出しサイトの配色に反映
コーディングの色指定
HEXやRGBをそのままCSSへ転記し実装を効率化
ブランドカラーの特定
ロゴ画像から正確なブランドカラーを割り出す
印刷物の色味確認
CMYK値を取得し印刷データの色設計に活用
写真からの色見本作成
好きな写真から狙った色を1点ずつ取得して控える
基礎知識
スポイトツールとは
スポイトツールとは、画像上の 1 点をクリックしてその場所の色をカラーコードとして吸い取る機能のことで、デザインソフトに共通して備わる定番機能です。Web 用途では吸い取った色を 16 進数のカラーコードで扱うのが一般的です。
拾う場所で色の値が少し変わる理由
JPEG などの圧縮画像では、圧縮の副作用で隣り合うピクセルの色がわずかに揺れています。単色に見える場所でも 1 ピクセルずれると値が変わることがあるため、拡大表示で狙った点を正確に選ぶのが確実です。
安全性とプライバシー
ブラウザ完結
入力データはお使いのブラウザ内だけで処理され、外部に送信されません。
ブラウザ内のみで処理
画像の色抽出はすべてお使いのブラウザ内で行われ、入力データはサーバーに送信されません。
通信はHTTPSで暗号化
ページの読み込みもTLSにより暗号化され、第三者から内容を読み取られません。
第三者への送信なし
広告ネットワークやトラッカーなど外部サービスへ入力内容を送信しません。
結果の自動保存なし
抽出した色や画像や入力候補をサーバーに保管することはありません。
更新情報
- update #164
画像カラーピッカーのプレビューを2本指ピンチで拡大縮小
- update #89
画像カラーピッカーで画像プレビューを主役に配置しドラッグで差し替え可能に




















