About this bench

Pikkola, tool No. 14

Contrast is arithmetic, not taste. Here is what the numbers are, and what they are not.

A measuring tool, not a mood board

Most colour sites sell palettes. We kept needing the other thing: the ratio between two colours, the hex of a screenshot, the OKLCH value that keeps a scale even. Those are measurements, and a pair of colours has one ratio, not an opinion.

The bench holds four instruments because they were the four tabs open on this desk: a contrast check, a converter, a harmony builder and a colour picker for screenshots.

How the ratio is computed

The page follows WCAG 2.1. Each sRGB channel is divided by 255 and linearised, below 0.04045 by 12.92 and above it with a 1.055 divisor and a 2.4 exponent. The channels are weighted 0.2126 red, 0.7152 green and 0.0722 blue, and the two luminances are compared as (L1 + 0.05) / (L2 + 0.05).

This is the same arithmetic as the W3C's published examples, which means a value from this page can be checked against another tool and argued with in a bug report.

Where the suggested shade comes from

When a pair falls short of 4.5 to 1, the text colour is mixed toward black and toward white in steps of four tenths of a percent, and the first mix that clears the line is offered. That is why the suggestion is the nearest shade rather than a guess, and why both directions are shown: darkening a warm grey and lightening it give different results on the same background.

The five colours from an image

The picture is drawn at no more than 240 pixels on its long edge. Transparent pixels and pixels within eight steps of white are skipped, and the rest are split by median cut into five groups along whichever channel has the widest spread. Each group's average becomes a swatch and its share becomes a percentage.

It is a summary, not a colour managed analysis. No ICC profile is applied, and a picture with fewer than five distinct colours returns fewer swatches rather than five invented ones.

What it will not do

It is not an accessibility audit. Focus order, form labels, alt text, motion and meaning carried by colour alone are obligations a ratio cannot check.

It does not simulate colour vision deficiency, and it does not implement APCA or the other candidate contrast methods. AA and AAA are where the law and the design systems are, so that is what the page reports.

It keeps no history of your colours. Close the tab and the pair you were working on is gone.

If something is wrong

Write to hello@pikkola.com with the two colours and the value you expected. For a ratio, that is the whole bug report.

Back to the studio