Image Color Picker

What is an image color picker?

An image color picker lets you point at any photo, screenshot, or graphic and read off the exact color under your cursor, instead of guessing a hex value by eye. Load a picture into this tool and it becomes a color picker from image: hover over any pixel and a live swatch tracks it in real time, then click to lock in that color and get its hex, rgb(), and hsl() values ready to copy. It turns “that green in the background” or “the blue in the logo” into a code you can paste straight into CSS, a design file, or a slide.

It also works from more than a single click. Because the tool automatically pulls out the eight most common colors in the picture and keeps a running row of your recent picks, it doubles as a way to get color from image sources with more than one hue worth capturing — a product photo, a screenshot of a website, a scanned swatch card — so you walk away with a small palette instead of one isolated value.

How to pick a color from an image

1. Load an image. Click Choose an image, drag a photo onto the drop area, or paste one straight from the clipboard with Ctrl+V (Cmd+V on a Mac) — the picture opens right in the browser, no upload step involved.
2. Hover, then click, to sample a pixel. Move the pointer over the image and a live preview swatch shows the color under the cursor with its hex code, updating as you move. Click to pick that exact pixel — the color lands in a panel with a large swatch, copy buttons for its hex, rgb(), and hsl() values, and a chip naming the closest of 220 named colors that links through to that color’s shades page.
3. Build a palette from the image. Below the image, the eight most common colors in the picture appear as a row of swatches, and a Recent picks row keeps the last colors you clicked — click either one to re-select it. When you’re done, Remove image clears everything so you can load another.

What people use it for

The most common reason people reach for a color picker from image is matching a brand color they don’t have the code for — a logo saved as a flattened PNG, a screenshot of a competitor’s site, a photo of a printed swatch card. Instead of eyeballing a hex value in an image editor, you click the exact pixel and get the hex, rgb(), and hsl() ready to paste into a stylesheet or a brand document.

Others use it to build a palette rather than grab one value: sampling several spots in a photo — a sunset, a piece of packaging, an interior shot — and using the Recent picks row alongside the extracted eight-color palette to assemble a set of colors that share a mood, then carrying that into a website, a slide deck, or a print layout. It’s just as handy for everyday design and presentation work, where matching a slide’s accent color to the photo it sits next to matters more than sourcing a color from a formal brand guide.

Honest limitations

The image never leaves your browser: it’s drawn into a canvas element and read back pixel by pixel with JavaScript, so nothing is uploaded and no copy sticks around after you close the tab. But what gets sampled is exactly what the browser decoded and painted, not the original file’s untouched data — in a JPEG, compression has already shifted colors slightly, most visibly right next to sharp edges, so a hex sampled near an edge can differ a little from the color in the original scene. Sampling does read from the image at full resolution rather than the scaled-down version on screen, so a click lands on the true source pixel rather than a blend produced by display scaling.

Photos carrying a wide-gamut color profile — a Display P3 shot straight off a recent phone, for example — are converted to sRGB when drawn to the canvas, so the hex you get back is an sRGB approximation of a wider-gamut original. The eight extracted colors are found by grouping similar pixels into buckets, counting them, and averaging each bucket — a fast approximation of the dominant colors rather than true perceptual clustering, so a small patch of vivid color can get missed while a large muted background dominates the row. And animated formats are sampled from whichever frame is currently showing, while fully transparent pixels report the transparency itself rather than any color underneath it.

Why is it free?

This picker runs entirely in your browser: the image is decoded locally, sampled locally, and never sent to a server, so there’s nothing to upload and nothing that lingers after you leave the page. There’s no account to create, no watermark on the colors you copy, and no feature — the palette extraction, the recent picks, the copy buttons — held back for a paid tier. It’s free the way every tool on this site is free: built to be useful, not to upsell you.