Skip to content

Image Color Picker

Pick the exact colour of any pixel in a PNG, JPG or WebP image. Click or tap to sample, use a magnifier and arrow keys for pixel precision, and copy HEX, RGB, HSL or CSS values, including alpha for transparent pixels.

Image Runs client-side Free to use
Jump to the tool
Share: X WhatsApp
Loading Image Color Picker…

About the Image Color Picker

Image Color Picker reads the exact colour of the pixel you choose. Open a PNG, JPG or WebP image, then click or tap anywhere on the preview. A magnifier shows the 11 × 11 pixels around your selection so you can land on the right one, and you can fine-tune the position with the arrow keys or by typing X and Y coordinates.

For the selected pixel you get its coordinates, HEX, RGB, HSL, HSV, alpha and a ready-to-use CSS value. Values come from the pixel data your browser decodes: RGB and alpha are whole numbers, HSL and HSV are shown to 1 decimal place. Embedded colour profiles are not applied, so this is not a calibrated colour measurement. Recent samples are listed for the current visit only and can be downloaded as a text summary. Unlike a palette extractor, it never averages — every value is one exact pixel.

How to use

  1. Choose or drop a PNG, JPG or WebP image.
  2. Click or tap the pixel you want, or drag to explore.
  3. Use the arrow keys (Shift for 10 px) or type X and Y to fine-tune.
  4. Press Enter or click again to add the colour to the recent list.
  5. Copy HEX, RGB, HSL or CSS, or download the palette summary.

Key features

  • Exact single-pixel sampling with no averaging.
  • 11 × 11 pixel magnifier around the selection.
  • Coordinates, HEX, RGB, HSL, HSV, alpha and CSS output.
  • Alpha shown for transparent and partly transparent pixels.
  • Keyboard pixel movement and manual coordinate entry.
  • Recent samples for this visit only, with a downloadable summary.
  • Copy HEX, Copy RGB, Copy HSL and Copy CSS.

Best practices

  • Use the magnifier to avoid edge pixels blended by antialiasing.
  • Sample from PNG or high-quality originals; JPG compression shifts colours.
  • Use the arrow keys for single-pixel precision.
  • Check alpha before using a colour from a transparent area.
  • Use a calibrated workflow for print or brand-critical colour.

Benefits

  • Exact values for design, development and documentation.
  • Faster than opening a full image editor.
  • Works offline once loaded.
  • Private: nothing is uploaded or stored.

Frequently asked questions

How precise are the values?

RGB and alpha (0–255) are whole numbers read directly from the decoded pixel. HSL and HSV are calculated from those values and shown to 1 decimal place; alpha as a fraction is shown to 3 decimal places.

Why might the colour differ from another app?

Apps can apply embedded colour profiles or display corrections differently. This tool reports the pixel values your browser decodes without applying profiles, so it is not a calibrated colour measurement.

How are transparent pixels shown?

Alpha is shown as 0–255 and as a fraction, and HEX includes the alpha byte when a pixel is not fully opaque. Browsers store partly transparent pixels in a way that can shift RGB by a few levels, and fully transparent pixels report RGB 0, 0, 0.

Can I select a pixel with the keyboard?

Yes. Focus the preview and use the arrow keys to move one pixel (Shift moves 10), or type exact X and Y coordinates. Press Enter to add the colour to the recent list.

How is this different from a palette extractor?

A palette extractor finds dominant colours across the whole image. This tool reports the exact colour of the single pixel you choose.

Is my list of sampled colours saved?

No. It exists only while the page is open. Download the palette summary if you want to keep it.

Which files can I use?

PNG, JPG and WebP files up to 40 MB and 30 megapixels. Each file’s signature is checked and the whole image is decoded before use, so GIF, SVG, damaged files and files renamed from another format are refused with a clear message.

Are my images uploaded or saved?

No. Images are opened and processed in your browser on your device. Nothing is uploaded, and images, pixels, settings and results are not saved in browser storage. Reset releases them from memory.