gizmobench
BrowseDaily

Image Color Picker

Drop in an image, click anywhere, and get the exact colour in hex, RGB, HSL, HSB, CMYK and more, with its nearest CSS name. The image's main colours are pulled out as a palette automatically, and the contrast check tells you whether black or white text will be readable on top. Your image is never uploaded.

· drop one here · or paste a screenshot

Never uploadedAny sizePalette extractedWorks offline
Colour
Sample size

Common questions

Is my image uploaded anywhere?
No, and for this tool that matters more than most. The file is drawn onto a canvas inside this browser tab and read back pixel by pixel; nothing is transmitted. People sample colours from unreleased designs, private screenshots and client work, none of which should be sent to an unknown server just to read a hex code.
Can I get a colour palette from an image?
Yes. As soon as an image loads, its most common colours appear under Palette from this image, largest share first. Choose 4, 6, 8, 10 or 12 colours, click a swatch to see it in every format, or press Copy hex codes to copy the whole palette, one code per line. Pixels are grouped into a coarse colour cube and counted, and fully or nearly transparent pixels are skipped, because averaging them in produces a muddy grey that appears nowhere in the picture. It is a fast approximation, so a colour covering a small but important area may not appear; click it directly instead.
Which formats can I copy the colour in?
Hex (the code HTML and CSS use), RGB, RGBA, HSL, HSV (the same model some editors label HSB), CMYK, a CSS custom property, a Swift UIColor initialiser, an Android hex integer and the nearest CSS colour name. The point is to paste straight into whatever you are building rather than converting by hand afterwards.
How is the colour name chosen?
It is the nearest of the 148 CSS named colours, measured by CIEDE2000 distance in CIELAB so the name that looks closest wins, not the one with the closest hex digits. An exact match is labelled exact; otherwise the row shows the name's own hex so you can see the difference. CSS names are a small vocabulary, so a colour from a photo is usually only near one.
Is the CMYK value a print match or a Pantone colour?
Neither. CMYK here is the standard formula (K is 1 minus the brightest channel) with no printer profile, so treat it as a starting point and proof on the actual press. The page has no Pantone, RAL, DMC or paint-brand colour tables, so it cannot name those; look the hex or RGB value up in that system's own guide.
Why do neighbouring pixels in a photo give different colours?
Photos carry noise, texture and JPEG artefacts, so one pixel of skin, hair or fabric can differ noticeably from the one beside it. Set Sample size to 3×3, 5×5 or 11×11 average to read the mean of that block of original pixels around the click instead of a single one. Keep 1 pixel for flat graphics, logos and screenshots, where every pixel in an area is identical.
What does the contrast figure mean?
It is the WCAG contrast ratio between the picked colour and whichever of black or white reads better on it. 4.5:1 is the minimum for normal body text to meet WCAG AA, 3:1 for large text, and 7:1 for AAA. The ratio runs from 1:1 (identical) to 21:1 (black on white).
Can I paste a screenshot instead of choosing a file?
Yes. Copy a screenshot and paste anywhere on the page. That is usually the fastest route, since the image never has to be saved to disk first.
Does it work with transparent PNGs and SVGs?
Yes. Transparent areas are left out of the palette so they do not skew it. A half-transparent pixel is read with its alpha, which shows in the RGBA value and as an 8-digit hex. Clicking a fully transparent spot picks nothing and says so, because there is no colour there to read.
Does it work on iPhone, Android, Mac, Windows and Chromebook?
Yes, in any current browser on any of them, with nothing to install and no extension. On a phone or tablet, Choose image opens your photos or files and a tap picks the colour; the live hover reading needs a mouse or trackpad. On a computer you can also drop a file on the page or paste a screenshot.

Colours are read from the image's own decoded pixels, so a 1 pixel sample of an opaque pixel returns its exact value (a half-transparent pixel's RGB can come back rounded, more so the more transparent it is); images larger than 4096 × 4096 pixels in area, or longer than 16,384 pixels on a side, are read from a scaled-down copy. A JPEG's compression may already have shifted a pixel from the original colour, how an embedded colour profile is handled depends on the browser, and CMYK is a formula conversion rather than a print proof.