HSL to HEX Converter
Convert HSL values to a hex color code instantly. Paste hsl(217, 91%, 60%) and copy the hex.
The formula
Chroma C = (1 − |2L − 1|) × S. Find the RGB sector from the hue (every 60°), add m = L − C/2 to each channel, multiply by 255 and write each as two hex digits.
Common colors
| Color | HEX | RGB | HSL | OKLCH |
|---|---|---|---|---|
| #000000 | rgb(0, 0, 0) | hsl(0 0% 0%) | oklch(0% 0 0) | |
| #FFFFFF | rgb(255, 255, 255) | hsl(0 0% 100%) | oklch(100% 0 0) | |
| #FF0000 | rgb(255, 0, 0) | hsl(0 100% 50%) | oklch(62.8% 0.258 29.2) | |
| #00FF00 | rgb(0, 255, 0) | hsl(120 100% 50%) | oklch(86.6% 0.295 142.5) | |
| #0000FF | rgb(0, 0, 255) | hsl(240 100% 50%) | oklch(45.2% 0.313 264.1) | |
| #FFFF00 | rgb(255, 255, 0) | hsl(60 100% 50%) | oklch(96.8% 0.211 109.8) | |
| #00FFFF | rgb(0, 255, 255) | hsl(180 100% 50%) | oklch(90.5% 0.155 194.8) | |
| #FF00FF | rgb(255, 0, 255) | hsl(300 100% 50%) | oklch(70.2% 0.322 328.4) | |
| #808080 | rgb(128, 128, 128) | hsl(0 0% 50%) | oklch(60% 0 0) | |
| #FFA500 | rgb(255, 165, 0) | hsl(39 100% 50%) | oklch(79.3% 0.171 70.7) | |
| #800080 | rgb(128, 0, 128) | hsl(300 100% 25%) | oklch(42.1% 0.193 328.4) | |
| #008080 | rgb(0, 128, 128) | hsl(180 100% 25%) | oklch(54.3% 0.093 194.8) |
Frequently asked questions
How do I convert HSL to hex?
Convert HSL to RGB with the chroma formula, then write each 0–255 channel as a two-digit hexadecimal number.
Why doesn’t my HSL round-trip exactly?
Hex stores 256 steps per channel while HSL is usually rounded to whole degrees and percentages, so tiny differences are normal.
More converters: HEX to RGB · RGB to HEX · HEX to RGBA · HEX to HSL · RGB to HSL · HEX to OKLCH · All formats at once