HSL to RGB Color Format Converter

Ten formats: HEX, RGB, HSL, HWB, CIELAB (lab), CIE LCH (lch), OKLab, OKLCH, CMYK and Display P3. Any of them can be the source or the target, which gives 90 conversion directions. Results use modern CSS Color 4 syntax, such as rgb(255 136 0) or oklch(0.7442 0.1812 56.46).

Enter the full CSS notation of the source format, such as hsl(32 100% 50%) or color(display-p3 1 0.5 0), or only its numbers, such as 32, 100%, 50% with HSL selected. Hex codes work with or without the #, in 3, 4, 6 or 8 digit form. The value must match the selected source format, so an rgb() value on an HSL page is rejected instead of being converted by mistake.

culori has no CMYK mode, so the converter uses the standard naive formula on sRGB values from 0 to 1: K = 1 - max(R, G, B), C = (1 - R - K) / (1 - K), and the same for M and Y. The reverse direction is R = (1 - C) x (1 - K) and so on. This is not an ICC profile conversion, so it will not match the output of a specific press or paper; use it for screen approximations and rough specs.

Use cmyk(0%, 47%, 100%, 0%), device-cmyk(0 0.47 1 0) or four bare numbers. Values with a percent sign are percentages; unitless values are read as fractions from 0 to 1, unless one of them is above 1, in which case all of them are read as percentages, so 0, 47, 100, 0 works as expected. CMYK output is always written as percentages with up to two decimals.

Lab, LCH, OKLab, OKLCH and Display P3 can describe colors that sRGB cannot show. When the target is HEX, RGB, HSL, HWB or CMYK, which are all sRGB, or Display P3, an out-of-gamut color is mapped with the CSS Color 4 algorithm, which lowers OKLCH chroma until the color fits, and the result carries a note. Lab, LCH, OKLab and OKLCH targets are unbounded and never mapped.

Yes, for every target except CMYK. An alpha value in the input, such as rgb(255 136 0 / 50%) or #ff880080, is written as / 0.5 inside CSS functions and as an 8-digit hex code. CMYK has no alpha channel, so the alpha is dropped there.

RGB channels are rounded to whole numbers from 0 to 255; HSL, HWB and CMYK percentages and Lab and LCH values to two decimals; OKLab values, OKLCH lightness and chroma and Display P3 channels to four decimals; hues to two decimals. All calculations run at full double precision before rounding, so converting back and forth stays within rounding of the original.

CIELAB and CIE LCH with the D50 white point, exactly as the CSS lab() and lch() functions define them, with Bradford adaptation from the D65 white of sRGB. Lightness runs from 0 to 100. OKLab and OKLCH are the perceptual spaces by Bjorn Ottosson used by CSS oklab() and oklch(), with lightness from 0 to 1.

The page form converts one color at a time. Clients that call the tool directly can send up to 100 colors, one per line, and get one converted value per line in the same order. Each color can be at most 100 characters long.

Neutral colors have no hue, which CSS can write as none. The converter writes 0 instead, so the value also works in tools that do not accept none. The hue has no visible effect when saturation or chroma is zero.