元画像の座標で1ピクセルを読む
縮小表示でも元キャンバスから読みます。左上は0,0、右下は幅−1,高さ−1です。値はブラウザのデコードと色管理に従います。
デザイン
画像カラーピッカー
ピクセルのHEX・RGB・アルファ値を確認し、パレットを作ります。
ファイルはこのブラウザ内で処理します。ファイルをドロップまたは選択。画像の貼り付けにも対応。
JPG・PNG・WebP / 最大40MB・1600万画素 / アニメーション・回転メタデータ非対応プレビュー
ファイルを選択してください。
結果
使い方
-
色を調べる画像を選択
画像を開くと左上のピクセル色を表示します。透明なピクセルのアルファは0です。
-
ピクセルを確認
画像をクリックするかX・Yを入力します。キャンバスにフォーカスして方向キーで1px、Shift併用で10px移動できます。
-
色を集めて保存
選んだ色をパレットに追加し、JSON・CSSを生成します。コピーは現在のピクセルのアルファ付きHEX値をコピーします。
書き出す前に確認したいこと
HEXと透明度
コピー値は#RRGGBBAA形式で、末尾はアルファです。FFは不透明、00は透明。RGBAも表示します。完全透明のRGBはデコードで0になる場合があり、隠れた色の復元には使えません。
現在の制限
- JPG・PNG・WebP / 最大40MB・1600万画素 / アニメーション・回転メタデータ非対応
- サイズは正の整数、1辺8192px・1600万画素以下にしてください。
- 最大32色。同じ色とアルファ値は重複追加しません。
- 代表色の自動抽出やCMYK・印刷色の計算は行いません。
- ブラウザや元画像のカラープロファイル処理により、別アプリと値が異なる場合があります。
画像ツールについて
市松模様の色も読みますか？
いいえ。市松模様は透明部分の表示で、読み取るのは元ピクセルとアルファです。
コピーできない場合は？
クリップボードが許可されない場合は案内を表示します。HEX欄を選択して手動でコピーできます。
透明ピクセルが黒の値になるのは？
アルファ0のRGBは見えず、Canvasが0にする場合があります。黒背景という意味ではありません。