Everyday tools · runs locally
Convert colours
HEX, RGB, HSL — pasted from anywhere, with tints, CSS snippets and an accessibility fix when the contrast fails.
- 1Paste a colour
Any format — #3B82F6, rgb(59,130,246), hsl(217,91%,60%) — detected automatically.
- 2Use any output
Every format in copyable rows, plus CSS snippets, a shade ramp and a tint ramp that both feed the box.
- 3Check it against white and black
Contrast ratios are shown for both, with the WCAG threshold marked. If it fails AA, the same-hue nearest passing colour is offered with one click.
Questions people actually ask
Why do the HSL numbers look different from my design app?
HSL is a transform, not storage. A designer's picker can be HSL-based while the file stores HEX; the actual colour is identical.
What contrast ratio do I need?
4.5:1 for normal text, 3:1 for large text — AA. The card says whether you're above or below, and the nearest accessible colour is calculated by nudging lightness while keeping the hue.