About

About ColorFinders

A colour toolkit that runs in your browser, built so that your image does not have to go anywhere.

Why it exists

Getting a colour out of an image is a small job that most tools make into a large one. The usual options are to open a full design application for a single value, or to hand your picture to a website that uploads it, processes it somewhere else and sends back a hex code.

Neither is necessary. Browsers have been able to decode an image and read its pixels for well over a decade, so a colour picker does not need a server, an account or a copy of your work. ColorFinders has none of them.

The name

The name describes the job: you arrive with an image and leave with the exact colour. The magnifier that follows your cursor is a loupe, the small lens a jeweller holds up to a stone to examine it closely. You hold it over a pixel and see exactly what is there.

How it works

Your file is decoded by the browser's own image decoder and drawn onto a canvas. When you click, the pixel under the cursor is drawn one-to-one into a one-pixel canvas with smoothing turned off, and its bytes are read back. Because of this extra step, the answer comes from the source file at full resolution and cannot be affected by how the image is scaled to fit your screen, how far you have zoomed, or what pixel density your display has.

Palette extraction works the same way, on a downscaled copy of the image, using median-cut quantisation. It is deterministic, so the same picture always produces the same palette. There is no machine learning involved and the site does not claim there is.

What is here

  • Image color picker: Sample the exact pixel colour from any image, then read it in nine notations.
  • Color picker: A saturation-value field and hue rail for choosing a colour from scratch.
  • HEX color picker: Type or adjust a hex code and see its tints, shades and nearest keyword.
  • RGB color picker: Drive red, green and blue channels directly and watch the value follow.
  • Color code converter: Paste any notation and get the other eight, plus ready-to-use code snippets.
  • Color contrast checker: Measure a foreground against a background and read the WCAG 2.2 verdict.
  • Color palette generator: Pull a palette out of an image, or build one from harmonies around a colour.
  • Gradient generator: Compose linear and radial gradients and copy the CSS.
  • Color blindness simulator: See which colours collapse into each other for the 8% who see colour differently.
  • Color mixer: Blend two colours, and see why sRGB goes muddy in the middle where OKLab does not.
  • CSS filter generator: Turn a hex into a CSS filter chain that recolours a black icon or SVG.
  • CSS color names: All 148 CSS colour keywords, searchable and sortable, with every value.

How it is built

The site uses Angular with standalone components and signals. It is prerendered to static HTML at build time, so every page arrives as a finished document instead of an empty shell waiting for JavaScript. The colour conversion library is hand-written and unit tested. Rounding errors in colour maths are easy to introduce and hard to notice, so tests check the arithmetic instead of it being taken on trust.

There is no backend. The whole site is static files, which is why it loads quickly and why there is no server that could be holding your data.

What it deliberately does not do

  • It does not upload your images, whether for processing, for analytics or for "improving the service".
  • It does not ask you to sign in. No tool here is held back behind an account.
  • It does not work around other sites' access controls. If a server refuses a cross-origin read of its image, that refusal is respected and you are told to download the file instead.
  • It does not overstate its accuracy. CMYK conversions and closest-colour names are labelled as approximate, because they are.
  • It does not bury the tool under advertising. Nothing on this site requires you to watch, click or wait for an advertisement.

Colour management

Colour management is the one thing a browser tool cannot do well. If an image carries an embedded profile such as Display P3, different browsers and operating systems may decode it to slightly different sRGB numbers. ColorFinders reports what your browser decoded, which is the right answer for web work and the wrong one for print production. For work that has to match a press, sample inside a colour-managed application.

Contact

Corrections, bug reports and requests are welcome at hello@colorfinders.com, or through the contact page.