Image Colour Picker
Click or tap any point in an image to read its exact colour, or let the tool find the image’s main colours for you. Copy values in HEX, RGB, HSL or CMYK and export the palette.
- No upload: runs in your browser
- Free, no account, no watermark
- HEX, RGB, HSL, CMYK
- Dominant colours
- Contrast check
Main colours in this image
Selected colour
Click or tap the image to pick a colour.
————Text contrast (WCAG)
My palette 0 colours
Colours you pick are added here.
Runs entirely in your browser. Your files are never uploaded to SBGeeks or anyone else. Privacy policy
How to use the Image Color Picker
- Drop an image on the box, choose one, or paste it.
- Click or tap anywhere on the image. Use the sample size to average a small area instead of one pixel.
- Copy the value you need, or use one of the dominant colours found automatically.
- Picked colours collect in your palette; export it as CSS variables or JSON.
How do I find the colour code of something in an image?
Runs entirely in your browser. Your files are never uploaded to SBGeeks or anyone else.
Free to use, with no sign-up, no limits on the number of files and no watermark added.
Built and maintained by SBGeeks, a digital marketing agency. Questions or problems? Contact us.
How it works
The image is drawn on a canvas at full resolution and the colour is read directly from its pixel data. Averaging over 3 × 3 or 5 × 5 pixels gives a more representative colour on photos, where neighbouring pixels vary.
Dominant colours are found by grouping similar pixels from a sample of the image and ranking the groups by size. The contrast figure is the WCAG 2 contrast ratio against white and black text; 4.5:1 is the minimum for normal-size text.
Useful for
- Matching a brand colour from a logo
- Building a website or social palette from a photo
- Checking whether text on a colour will be readable
- Getting exact colours for design hand-offs
Limitations
- CMYK values are a straightforward mathematical conversion, not a colour-managed print profile; ask your printer for exact values.
- JPG compression slightly alters colours, especially near edges, so sample flat areas for brand colours.
- Transparent pixels are reported with their alpha value.
Questions
Why is the colour slightly different from the official brand colour?
What do the contrast numbers mean?
Related free tools
SBGeeks designs and builds websites that load quickly and turn visitors into enquiries.
