How to use the image color picker
- 1 Drop an image on the box, or click browse to choose it from your device.
- 2 Move over the picture to preview colours, then click or tap the exact spot you want.
- 3 Copy the HEX, RGB, HSL or CMYK code with the copy buttons.
- 4 Use the palette below the image to copy the main colours of the whole picture.
Building a colour scheme from a photo
Pick one dominant colour for backgrounds, one darker colour for text and one bright accent for buttons. Use the codes in Add Border to Image to frame photos in matching colours, or in Favicon Generator to make a site icon that fits the scheme.
- Pick from flat areas, not edges, for a clean colour.
- Check contrast between text and background colours for readability.
- Screens show colours differently, so test the scheme on a phone too.
Features
Pixel-accurate picking
Hover to preview, then click to get the exact colour of a single pixel.
Four colour formats
HEX, RGB, HSL and CMYK codes with one-click copy.
Automatic palette
The main colours of the image, ready to use in a design.
When to use it
Matching brand colours
Find the exact HEX code of a logo when you do not have the brand guidelines.
Web design
Pick colours from a photo to build a matching website or slide theme. To view the photo's details, use EXIF Data Viewer.
Painting and decorating
Take a photo of a fabric or wall and find a close colour code to compare with paint charts.
Fixing screenshots
Get the exact background colour of an app or website to edit a screenshot neatly. To add a matching frame, use Add Border to Image.
Related Image tasks
Frequently asked questions
What is a HEX colour code?
A HEX code is a six-character code, such as #1A73E8, that describes a colour as amounts of red, green and blue. It is the standard way to write colours in websites and design apps.
What is the difference between RGB and CMYK?
RGB mixes red, green and blue light for screens. CMYK mixes cyan, magenta, yellow and black ink for print. The CMYK value shown is a simple conversion, so ask your printer for an exact match.
Why does the colour look different from what I expected?
Photos contain shadows, highlights and noise, so neighbouring pixels can differ. Zoom in, pick from a flat area, or use the palette, which averages similar colours.
Can I pick a colour from a screenshot?
Yes. Take a screenshot, save it, and drop it here. Screenshots are ideal because they keep the exact colours shown on screen.
How is the palette worked out?
Similar colours across the image are grouped together, and the most common groups are shown, largest first. It gives a quick, practical colour scheme rather than a scientific analysis.
What is HSL used for?
HSL describes a colour by hue, saturation and lightness. It is handy in design and CSS because you can make a colour lighter or darker by changing just one number.
Does it work on my phone?
Yes. Open the page in your mobile browser, choose a photo from your gallery and tap the spot you want.
Is my picture uploaded to pick colours?
No. The image is drawn and read inside your browser, so it stays on your device and nobody else can see it.
How this tool works. These image tools run entirely in your browser using the Canvas API built into every modern browser, the open-source libheif decoder for iPhone HEIC photos and Tesseract, a widely used open-source OCR engine, for reading text. Each tool is tested with real phone photos, screenshots and scans before it goes live, and nothing you open is sent to a server.
Built and reviewed by Hamza Farooq, founder and lead developer
· Last updated
· How we check our tools
· Report a problem