~/frontend-tools/color-format-converter
Color Format Converter
Enter a colour in any CSS format, or pick one, and get it in every other format at once: HEX, HEX with alpha, RGB, HSL, HWB, OKLCH and approximate CMYK. Click any value to copy it.
Using the Color Format Converter
Which format to use
HEX is compact and universal. RGB and HSL are easy to read and support transparency. HSL is handy for making lighter or darker versions of a colour by changing one number. OKLCH, the newest, is perceptually uniform: changing lightness by the same amount looks like the same change across different hues, which makes it ideal for generating palettes.
How parsing works
The converter lets the browser itself read your input, so anything valid in CSS works, including named colours such as rebeccapurple, rgb() with or without commas, hsl() and oklch(). The conversions are then calculated from the resulting sRGB value.
About CMYK
CMYK describes ink on paper and depends on the printer and paper profile. The CMYK shown is a simple mathematical conversion, fine as a starting point for print briefs but not a substitute for a colour-managed proof.
Wide-gamut colours
OKLCH can describe colours outside the sRGB range that some modern screens can show. The converter works in sRGB, so very saturated OKLCH input is clipped to the nearest displayable sRGB colour.
Working with transparency
Every format except CMYK can carry an alpha channel for transparency. In modern CSS the slash syntax works for all of them, such as rgb(91 140 255 / 0.5) or oklch(68% 0.16 262 / 0.5). Eight-digit HEX stores alpha as the last two characters, so 80 means about 50 percent opacity.
Frequently asked questions
Can I convert colours with transparency?
Yes. Alpha is kept in the HEX8, RGB, HSL, HWB and OKLCH outputs.
Why is my OKLCH value slightly different from my input?
Values are rounded for readability, and colours outside sRGB are clipped.
Is there a palette tool?
Yes. The CSS colour palette generator builds harmonies and a 50 to 900 scale from one colour.