By Ahsan Khowaja · Updated 27 October 2026
How to pick a color from an image
- Drop an image on the box, tap Choose image, or paste a screenshot with Ctrl+V (Cmd+V on a Mac).
- Click or tap the spot whose colour you want. On a computer, the colour under the pointer also shows as you move it, so you can aim before you click.
- Copy the code you need: click the HEX, RGB or HSL button and it's on your clipboard.
The image color picker also lists the main colours in the image, biggest areas first, so you can grab a whole palette from a photo or a brand's logo in one go. Everything happens in your browser: the picture is drawn on your own screen and never uploaded.
HEX, RGB and HSL: which color code do you need?
The same colour can be written three common ways, and this tool gives you all of them:
| Format | Example | Where it's used |
|---|---|---|
| HEX | #1E90FF | Websites (CSS), design apps, brand guidelines, Canva, Figma |
| RGB | rgb(30, 144, 255) | CSS, Photoshop and most image editors, Office colour dialogs |
| HSL | hsl(210, 100%, 56%) | CSS when you want to make a colour lighter or darker by changing one number |
A HEX code is just the three RGB numbers written in base 16: 1E is 30, 90 is 144 and FF is 255. If you need to switch between them later, use the hex to RGB converter or the RGB to hex converter.
HSL describes a colour as hue (its position on the colour wheel, 0–360°), saturation (how strong it is, 0–100%) and lightness (from black at 0% to white at 100%). It's handy for designers: keep the hue and saturation of a brand colour and change only the lightness to get matching light and dark shades.
Getting the exact hex code from an image
Photos are made of millions of slightly different pixels, so two clicks a few pixels apart can give different codes, especially on fabric, skin, sky or anything with texture or noise. A few tips for an accurate hex code from an image:
- Use the palette for "the" colour of an area. Each palette colour is an average of all the similar pixels, which is usually closer to what your eye sees than one single pixel.
- Click the middle of flat areas in logos and graphics, not the edges, where colours blend into the background (anti-aliasing).
- Use the original file, not a screenshot of it if you can. Screenshots and heavily compressed JPGs can shift colours slightly, and JPG compression adds speckles around sharp edges.
- Expect photos to differ from the real object. The camera's white balance, the light in the room and editing filters all change the colours recorded. The picker tells you the colour in the file, which is what matters for matching it on screen.
Make a color palette from an image
The "main colours" list groups similar pixels together and ranks the groups by how much of the picture they cover, skipping colours that are almost the same as one already listed. For a landscape photo that typically gives you the sky, foliage and ground colours; for a logo or illustration it gives you the flat brand colours almost exactly.
Designers use a color palette from an image to build a website or social post that matches a photo, to pull brand colours from a logo when nobody has the brand guidelines, or to find a paint or fabric shade that goes with a picture. After you've chosen text and background colours, check they're readable together with the color contrast checker.
Other ways to pick colours on your device
An online eyedropper tool is quickest when you already have the image in a file or screenshot. If you need colours from anywhere on your screen, these built-in tools also work:
- Windows: Microsoft's free PowerToys includes a Color Picker you open with Win + Shift + C; it copies the code of any pixel on screen.
- Mac: the Digital Color Meter app (in Applications › Utilities) shows the RGB values under the pointer.
- Chrome and Edge: in Developer Tools, the colour swatch next to any CSS colour opens a picker with an eyedropper that works on the web page.
Is it private?
Yes. The image is decoded and drawn by your own browser, and the colours are read from that drawing. Nothing is sent to our server, and nothing is stored when you close the tab. Very large images are scaled down to 1,600 pixels on the long side for speed, which doesn't change the colours of flat areas.
Supported images
PNG, JPG, WebP, GIF (first frame), BMP and AVIF files work. iPhone HEIC photos need converting first with the HEIC to JPG converter. Transparent pixels in PNG and WebP files are ignored when the palette is built.
