OneTaskBy Tim King · Updated
Image Colour Picker
Eyedropper Online to Pick HEX, RGB and HSL Codes From a Photo or Screenshot
OneTask is free, with no sign-up, and built by one person.
If this tool saved you time, a coffee helps keep new ones coming.
How the Image Colour Picker works
This image colour picker works like an eyedropper for any photo, screenshot or logo: drop the image in, click a point and read off its HEX, RGB and HSL values, ready to paste into CSS, Figma or a brand guide.
How to use the image colour picker
Drop in an image and click anywhere on the preview. A ring marks the point you clicked and the
panel below shows the colour as a HEX code, an rgb() value and an hsl() value. Click again
anywhere else to pick a new colour; the last eight distinct picks are listed under Recent picks
so you can collect a small palette as you go. Select any value with the mouse to copy it.
Single pixel or averaged sample
Photos are noisy: two neighbouring pixels on a blue sky can differ by several shades because of sensor noise and JPEG compression. 1 pixel gives the exact value at the point you clicked, which is right for flat graphics, logos and screenshots. 3 × 3 and 5 × 5 average a small square around the point, giving a steadier, more representative colour for photographs and textured surfaces.
Accuracy and colour profiles
The value reported is the colour your browser decoded, in standard sRGB. For screenshots and web graphics that matches the original file exactly. Photos shot in a wide-gamut profile such as Display P3 are converted to sRGB as they are decoded, so very saturated colours may differ slightly from what a colour-managed photo editor shows in the native profile.
Transparency
If the point you click is partly transparent, an Alpha line shows its opacity from 0 to 1. The HEX and RGB values describe the colour itself, not the colour blended with any background.
Private by design
The image is opened only in your browser and is never uploaded. Nothing is saved after you close the page.
FAQ
How do I get the HEX code of a colour in a picture?
Drop the picture in and click the colour you want. The HEX code appears straight away along with RGB and HSL versions, and you can select it with the mouse to copy it to your clipboard.
Why does the colour change slightly when I click nearby?
Photos contain noise and compression artefacts, so neighbouring pixels rarely match exactly. Switch Sample size to 3 × 3 or 5 × 5 to average the area around your click for a steadier reading.
Can I pick colours from a screenshot of a website?
Yes. Screenshots are flat sRGB images, so a single-pixel sample returns the exact colour the page displayed. Avoid edges of text and shapes, where anti-aliasing blends the colour with the background.
How do I get the main colours of an image automatically?
This tool reads the colour at a point you choose. To pull out the dominant colours of a whole image as a palette in one step, use the palette extractor tool instead.
See also: all Images tools, Audio, Video & Screen, PDF, SVG, Simulations & Screensavers, Generative Art, Chart Makers, 3D Model Viewers, Drawing Pads, Mockups & 3D Making, Diagram Makers, 3D Science, Tracker Music.
Related tools
Palette Extractor
Pull the dominant colours out of a photo as hex codes.
Image To SVG
Trace a PNG or JPG into a scalable vector SVG.
Circle Crop Image
Crop a photo to a circle, oval or rounded rectangle.
Blur Image
Blur a whole photo, or brush over the parts to soften.
Combine Images
Join photos side by side or stacked into one image.