画像カラーピッカー

用途

本ツールはアップロードした画像を、クリックできるカラーソースに変えます。任意の場所にホバーすると、カーソル下のピクセルを HEX／RGB／HSL で読み取れます。8× 倍率のルーペにより、目を細めずに正確にピックできます。クリックすると、その色をカスタムパレットにロック：複数クリックで自分のパレットを構築できます。パレット上のスウォッチをクリックすると削除されます。画像はブラウザから出ません。

使うべきタイミング

• 写真から特定のトーンを抜き出してデザインに使いたいとき。
• HEX が不明なブランドアセットに、UI アクセントカラーを合わせたいとき。
• ロゴ画像から各ブランドカラーを 1 つずつ抜き出したいとき。
• 映画のスチルやアート作品からムードボード用パレットを作りたいとき。
• 「同じ色に見えるが実際には異なる」を切り分けたいとき。

精度の仕組み

1 ピクセル単位のサンプリングは厳密ですがノイジーです。アンチエイリアシング、JPEG 圧縮、サブピクセル描画の影響で隣接ピクセルがわずかにずれます。8× ルーペで狙ったピクセルそのものを見ながらクリックできるので、平均に頼る必要がありません。ブランド抽出では重要、ムードボードでは無視できます。

よくある注意点

• テキストのアンチエイリアシング。 文字の縁は本来の"インクの色"を反映していません。太い線の中央をクリックしてください。
• JPEG アーティファクト。 圧縮の強い写真は平坦に見える領域で色がドリフトします。きれいに取りたいなら PNG ソース推奨。
• 表示用にスケーリングされる。 大きい画像は ~700px 幅まで縮小されます。クリックするのは表示中のキャンバスのピクセルです（元画像ではない）。極小要素のピクセル単位抽出が必要ならアップロード前にクロップを。
• HSL は派生値、格納値ではない。 ブラウザは RGB を保持し、HSL は同じ色の別表現です。ラウンドトリップで丸めによる微小ズレが出ます。