Web制作、資料、イラスト、ブランド素材などで、見本画像と同じ色を再利用したいときに便利です。
画像カラーピッカー・色コード抽出
写真やスクリーンショットをクリックし、その場所の色をHEX・RGB・HSLで取得してコピーできます。
最初にすること
色を調べたい画像を選択します。
ブラウザ内で処理
画像の読み込みとピクセルの取得はブラウザ内で行われ、画像は当サイトのサーバーへ送信されません。
主な用途
ロゴやバナーからブランドカラーを取得する
画像を選ぶと、ポインターを合わせた場所の色を確認できます。
現在の色まだ色を取得していません
画像を選ぶと、ポインターを合わせた場所の色を確認できます。
ピクセル拡大表示
画像をクリックして色を固定
画像上でポインターを動かすと色と周辺ピクセルを確認できます。クリックすると色コードを履歴へ残します。
取得した色
選択した色を新しい順に8件まで表示します。
要点
画像の指定位置からカラーコードを取得
写真やスクリーンショットの知りたい場所をクリックすると、そのピクセルのHEX・RGB・HSLを表示してコピーできます。
JPEGの圧縮ノイズ、影、光の反射により、見た目が同じ範囲でも隣のピクセルと値が異なることがあります。印刷物の色を保証する測色器ではありません。
画像に透かし：写真やイラストに文字またはロゴの透かしを重ね、位置・大きさ・透明度・角度を確認して画像として保存できます。
このツールについて
写真やスクリーンショットをクリックし、その場所の色をHEX・RGB・HSLで取得してコピーできます。
画像の読み込みとピクセルの取得はブラウザ内で行われ、画像は当サイトのサーバーへ送信されません。
使い方
- 色を調べたい画像を選択します。
- 画像上でポインターを動かし、拡大表示と現在の色を確認します。
- 必要な位置をクリックし、固定した色のHEX・RGB・HSLをコピーします。
よくある用途
- ロゴやバナーからブランドカラーを取得する
- スクリーンショット内のボタンや背景色を調べる
- 写真から資料やSNS投稿に使う色を選ぶ
- HEX・RGB・HSLをデザイン担当者へ共有する
使うときのポイント
- 写真では1ピクセルだけで判断せず、近くの複数箇所を比較してください。
- Webや画面表示にはHEX・RGB、色相や明るさを調整するときはHSLが便利です。
- 印刷用CMYKへの変換では、印刷会社のカラープロファイルと色校正を優先してください。
対応範囲と注意点
- 透明部分は画面上の合成結果ではなく、キャンバスで読み取れるRGB値として扱います。
- モニターの色設定や画像のカラープロファイルにより、同じコードでも見え方が異なる場合があります。
よくある質問
画像からHEXカラーコードを取得できますか？
はい。画像の任意の場所をクリックすると、HEX・RGB・HSLを同時に表示します。
スマートフォンでも色を選べますか？
はい。画像をタップすると色を固定できます。細かな位置は拡大プレビューを見ながら調整してください。
写真の色と表示値が少しずれるのはなぜですか？
JPEG圧縮、影、反射、画面の色設定などで、見た目が近い場所にも異なるピクセル値が含まれるためです。
画像は保存されますか？
いいえ。画像はブラウザ内で処理され、当サイト側には保存されません。