Image Color Picker — Get Color Codes (Eyedropper)
Last updated: 2026-06-25
Photos never leave your device · 100% client-sideThe image color picker is an eyedropper that grabs the color of any spot you click as a HEX and RGB code.
Even when scaled down on screen, the click is mapped to the original pixel for an accurate reading, all done on a canvas in your browser.
Color Picker Tool (Eyedropper)
Click the spot on the image where you want to pick a color.
Picked color
#000000
How to use
- Select an image — Drag the photo you want to sample colors from, or upload it with the file picker.
- Click a spot — Click (or tap) the spot on the image where you want to pick the color.
- Read the code — The clicked pixel's HEX and RGB codes and a color swatch are shown.
- Copy — Click the copy button to copy the HEX or RGB code to your clipboard.
What are HEX and RGB color codes?
Every color on a screen is made by mixing red (R), green (G) and blue (B) light. Expressing each on a 0–255 scale is RGB; writing the same values as two hexadecimal digits each, for six digits total, is HEX. For example, teal is rgb(13, 148, 136) = #0d9488 — the same color written two ways.
This tool draws the photo on a canvas, maps your click from screen coordinates to original pixel coordinates, and reads that pixel's RGB value with getImageData(). Even when the photo is shrunk on screen, it picks the exact color of the original pixel.
Color code conversion examples
| Color | RGB | HEX |
|---|---|---|
| White | rgb(255, 255, 255) | #ffffff |
| Black | rgb(0, 0, 0) | #000000 |
| Red | rgb(255, 0, 0) | #ff0000 |
| Teal (brand) | rgb(13, 148, 136) | #0d9488 |
To prepare the image you sample from, use crop image or resize image; to change the tone, use grayscale converter.
Frequently asked questions (FAQ)
What is the difference between HEX and RGB color codes?
RGB expresses red, green and blue each as 0–255 (e.g. rgb(13, 148, 136)), while HEX writes the same values as a 6-digit hexadecimal (e.g. #0d9488). Web design mostly uses HEX; some design tools prefer RGB.
Can I pick the color of an exact pixel?
Yes. Even when the image is scaled down on screen, the click position is mapped to the original pixel coordinates to read the real color there. Compression can make neighboring pixels slightly differ, so click a few times to compare.
What can I use the picked color for?
Matching brand colors, building design palettes, entering colors in CSS or design tools, choosing a background tone that fits a photo, and more. Copy the HEX or RGB and paste it straight in.
Are my photos uploaded to a server?
No. Color picking runs 100% inside your browser, and your photos are never uploaded or stored.
Related tools & guides
Last updated: 2026-06-25