HEX to HSL Converter
Convert HEX colors to HSL format instantly. HSL - hue, saturation, and lightness - is the most human-readable color format, making it ideal for theming, brightness adjustments, and color palette design in CSS.
name, hex, rgb, hsl, oklch, hwb, cmyk, ncol
| Format | Value | |
|---|---|---|
| HSL | hsl(12, 100%, 67%) | |
| Name | - | |
| Hex | #ff7a59 | |
| RGB | rgb(255, 122, 89) | |
| OKLCH | oklch(72.9% 0.1696 35.11) | |
| HWB | hwb(12, 35%, 0%) | |
| CMYK | cmyk(0%, 52%, 65%, 0%) | |
| NCol | R20, 35%, 0% |
Opacity:
100%Lighter / Darker:
hsl(0, 0%, 100%)
hsl(14, 100%, 95%)
hsl(12, 100%, 86%)
hsl(12, 100%, 77%)
hsl(12, 100%, 68%)
hsl(12, 100%, 59%)
hsl(12, 100%, 50%)
hsl(12, 100%, 41%)
hsl(12, 100%, 32%)
hsl(12, 100%, 23%)
hsl(12, 100%, 14%)
hsl(12, 100%, 5%)
hsl(0, 0%, 0%)
Contrast Checker
WCAG contrast ratios for this color as text on white and black - and for white and black text on this color as background.
Hey thereHave a wonderful day.
Contrast Ratio 2.57:1
AAAA LargeAAAAAA Large
Hey thereHave a wonderful day.
Contrast Ratio 8.18:1
AAAA LargeAAAAAA Large
Hey thereHave a wonderful day.
Contrast Ratio 2.57:1
AAAA LargeAAAAAA Large
Hey thereHave a wonderful day.
Contrast Ratio 8.18:1
AAAA LargeAAAAAA Large