Colour Converter

Three ways of writing one colour

HEX — #1A6AFF. Compact, universal in CSS, unreadable to humans.
RGB — rgb(26, 106, 255). The same three numbers in decimal, and the form that takes an alpha channel.
HSL — hsl(219, 100%, 55%). Hue, saturation, lightness. The only one where you can make a colour lighter by changing a single number, which is why design systems are built on it.

Why contrast is shown

WCAG sets a minimum contrast ratio of 4.5:1 for normal text and 3:1 for large text. Below that, text becomes hard to read for anyone with reduced vision — and in bright sunlight, for everyone.

Brand colours frequently fail. A mid-tone blue that looks fine in a mockup can sit at 3.2:1 against white, which passes for a heading and fails for body copy. Knowing before you ship is cheaper than a redesign after an audit.

Reading the ratio

Ratio	Meaning
Below 3:1	Fails everything. Decorative use only.
3:1	Large text (18pt+) at AA.
4.5:1	Normal body text at AA — the usual target.
7:1	AAA. Worth aiming for on long-form reading.

Frequently Asked Questions

Yes — free, no sign-up, and it converts as you type.

Yes. Everything runs in your browser after the page loads - nothing you type is sent anywhere. It is the same code our mobile app uses, compiled to run on the web, so the two can never disagree with each other.

4.5:1 for normal text and 3:1 for large text to meet WCAG AA. AAA asks for 7:1, which is worth aiming at for long-form reading.

Because it is the only one you can reason about. Lightening a colour in HSL means changing one number; in HEX it means recalculating all three channels.

No. Contrast ratio measures luminance difference, not hue difference. Two colours can have good contrast and still be indistinguishable to someone with red-green colour blindness — which is why colour should never be the only signal.

Yes, the conversion works in both directions and all three formats update together.

Three ways of writing one colour

Why contrast is shown

Reading the ratio

Frequently Asked Questions

Other free tools

Book Free Consultation