Color Picker from Image
Click or drag on the image to pick a color.
Open an image to start picking colors. Nothing is uploaded.
- HEX
- RGB
- HSL
Dominant colors
How to use
- Choose an image from your device, or press Use sample image to try it out.
- Click or tap anywhere on the picture to read that pixel. On a computer you can also use the arrow keys to nudge the pick point by one pixel, or hold Shift for ten.
- Copy the HEX, RGB or HSL value, or press a swatch in the palette to load one of the six dominant colors.
How it works
The picture is drawn onto a hidden canvas inside your browser, and the exact pixel under your pointer is read back as red, green and blue values from 0 to 255. HEX writes the same three numbers in base 16, so 11, 122, 106 becomes #0B7A6A.
HSL converts the same color to hue (0 to 360 degrees), saturation and lightness in percent. It is handy for making a color lighter, darker or less intense without changing its character.
The palette uses a box-splitting method similar to median cut. All pixels start in one box; the box with the widest spread of values is repeatedly split at the middle of its widest channel, until there are six boxes. Each swatch is the average color of one box, ordered by how much of the image it covers. Large photos are sampled, and transparent pixels are ignored.
FAQ
Is my image uploaded anywhere?
No. The file is opened with your browser's own tools and drawn on a canvas on your device. There is no upload and nothing is stored.
Why does the color differ from what I see in my design app?
This tool reads the pixel values the browser decodes. If your image has an embedded color profile such as Display P3, or has been compressed as a JPEG, the numbers can differ slightly from the original design file. Pick from a PNG for the most exact result.
Why is the pick not exactly where I clicked?
Large images are scaled down to fit the page, so one screen pixel can cover several image pixels. The color you get is from the scaled copy shown on screen.
Can I pick colors from a web page or my screen?
Take a screenshot first and open it here. A browser page cannot read the pixels of other tabs or apps.