Color Suite

Reads any CSS color and rewrites it in every syntax: hex, rgb, hsl, hwb, oklch, oklab, lab and lch, plus the nearest of the 148 CSS color names. It also checks WCAG 2 contrast, either for one color against white and black or between two colors you supply, and builds palettes in OKLCH: complementary, analogous, triadic, tetradic, split complementary, five tints, five shades, and a numbered scale from 50 to 950. Colors from outside the sRGB gamut are fitted by reducing chroma while lightness and hue hold, and the result tells you when that happened.

Paste a color such as #663399, rgb(102 51 153), oklch(0.44 0.16 303) or rebeccapurple and the conversion rows appear straight away. Switch the mode to "Contrast check" and write two colors as "#777777 on #ffffff" or "#777777, #ffffff" to get the ratio and the AA and AAA verdicts for normal and large text. Switch to "Palette" and pick a family to generate swatches, each with its hex and its OKLCH. Every row has a copy button, and the URL carries what you see so you can share it.

Most color converters online run one conversion per page, wrap it in ad slots, and stop at hex, rgb and hsl. This one does the modern spaces too, gets the white points right, gamut maps instead of silently clipping, and rotates palette hues in OKLCH so a generated scheme keeps an even perceived lightness. Your inputs never leave your device, and there is no signup or swatch limit.

Why are the palettes built in OKLCH instead of HSL?

HSL lightness is a rough arithmetic average, so rotating hue at a fixed HSL lightness makes yellows look washed out and blues look heavy. OKLCH lightness tracks what the eye actually sees, so a hue rotation or a tint step keeps its perceived weight. Any rotation that lands outside sRGB has its chroma reduced until it fits, and the row says so.

How accurate are the conversions, and which white point do they use?

The OKLab and OKLCH numbers use the matrices published by Bjorn Ottosson exactly, so pure red comes out as oklch(0.628 0.2577 29.23). The lab() and lch() values use D50, which is the white point CSS Color 4 defines for those functions, reached from sRGB through XYZ D65 and a Bradford adaptation: red is lab(54.29 80.8 69.89). Under D65 the same red is 53.24, 80.09, 67.20, so a converter that disagrees with this one is usually reporting a different white point. Contrast is WCAG 2 only; APCA Lc is not computed.

Is my color or palette uploaded anywhere?

No. Every conversion, contrast check and palette runs in your browser, nothing is logged, and the page keeps working offline after the first load.