Drop in a photo, screenshot, or logo and read the exact color of any pixel — hover to inspect live, click to lock, and copy the HEX, RGB, or HSL code with one click. Every picked color lands in a palette strip so you can collect a scheme from a single image.
How to pick a color from an image
- Drop your image (JPG, PNG, or WebP).
- Move the pointer over it — the color readout follows live. Click to lock a color.
- Copy the code you need. Keep clicking to build up a palette (the strip remembers 12).
Where this fits in real work
Matching a brand color from a logo when nobody can find the style guide. Pulling the exact background shade from a competitor’s screenshot. Extracting a palette from a photo for a design that should echo it. Checking what color a rendered element actually is, after blending and shadows. Grabbing values for a CSS theme from a mockup PNG. In each case the job is the same: the color exists only as pixels, and you need it as a code.
HEX, RGB, HSL — one color, three dialects
All three describe the same pixel. HEX is the terse web classic (#3366ff) — most color
fields accept it. RGB spells out the red/green/blue components (rgb(51, 102, 255)) — what
design tools and CSS functions use. HSL re-expresses it as hue, saturation, and lightness
(hsl(225, 100%, 60%)) — the format to copy when you plan to derive variants, because “same
hue, 10% lighter” is a one-number edit. The readout shows all three at once; copy buttons sit
next to each.
Accuracy notes worth knowing
Picking reads the actual decoded pixel — no rounding, no approximation. What can differ is the source: JPG compression nudges colors near sharp edges (pick from the middle of flat areas), and photos of screens or print bake lighting into every pixel. When exactness matters, work from an original PNG or an unscaled screenshot. Fine targets are easier with the X/Y inputs than the pointer. If the image is huge, resize it first for easier navigation — or crop to the region you care about.
Private by design
The image is decoded and read entirely on your device — unreleased designs, client mockups, and internal screenshots never touch a server.