Colour converter

Type any CSS colour — #b4521f, rgb(180 82 31), hsl(21 71% 41%), oklch(55% 0.15 45), rebeccapurple — or use the picker (and Pick from screen in Chromium browsers).

Formats lists the colour in every notation; each has a copy button.
Adjust has sliders for HSL, alpha, and OKLCH lightness, chroma, and hue. OKLCH changes keep lightness and hue and reduce chroma if the result would fall outside sRGB.
Tints and shades is an 11-step scale built in OKLCH so steps look evenly spaced; the CSS panel exports it as custom properties.
Harmonies rotate the hue in OKLCH (complementary, analogous, triadic, split, tetradic). Click any swatch to make it the current colour.
WCAG contrast checks text against a background — semi-transparent text is composited first — with AA and AAA verdicts for normal and large text and for UI graphics.

Presenting

The whole screen in the colour — to compare with a print or a paint chip, as a light panel, or to show a choice to a room — with its HEX, RGB, OKLCH and nearest name in the corner (H hides them). Press ⛶ Present (beside Share link) or F to open it; Esc or F closes it and T switches between dark and light. It goes full screen where the browser allows, otherwise it fills the window, and keeps the screen awake. Controls and the pointer fade after a few idle seconds.

Share link → Link options → Open in presentation mode makes a link that opens straight into this view. Browsers only allow real full screen after a click, so a link opened cold shows the view filling the window with a “Click for full screen” button.

Share link copies a URL that opens this tool exactly as you have it. Hand-written links work too: ?c=<any colour>&fg=%23fff&bg=%23b4521f. For example ?c=oklch(0.65%200.15%20250).

Presenting

Sharing