Find the colours in an image, with hex, RGB and HSL — and the contrast figures that decide whether text can sit on each one. Your file never leaves this page. Everything happens in your browser, and there is no upload endpoint to send it to — that is checked by a build gate that fails if any network code reaches a tool’s bundle.
How to do it
- Drop your image onto the box.
- Choose how many colours you want.
- Copy the hex values, or download the palette as CSS and JSON.
Questions
Why do I get fewer colours than I asked for?
Because colours too close to tell apart are merged. Asking for twelve from a photograph of a blue sky gives you the blues that are actually different, rather than twelve shades of one. A picture made of two colours has two.
Why not just take the most common colours?
Because a photograph has no most-common colour — a large image usually holds over a million distinct values, almost all appearing once. Ranking those gives five indistinguishable greys. Near-identical colours are grouped first, and the groups are ranked.
What are the contrast numbers for?
They say whether black or white text is legible on each colour, and by how much. It is the question people get wrong by eye — consistently, in the direction of thinking it is fine. 4.5:1 is the threshold for normal text.
What happens to transparent areas?
They are skipped. A logo on a transparent background is mostly nothing, and counting that as black would return a palette whose main colour is the absence of one.