RGB to HSL Converter
Convert RGB colors to HSL format instantly. HSL (hue, saturation, lightness) is far easier to reason about than raw RGB values, making it the preferred format for theme design, color manipulation, and dynamic CSS effects.
name, hex, rgb, hsl, hwb, cmyk, ncol
| Format | Value | |
|---|---|---|
| HSL | hsl(12, 100%, 67%) | |
| Name | — | |
| Hex | #ff7a59 | |
| RGB | rgb(255, 122, 89) | |
| HWB | hwb(12, 35%, 0%) | |
| CMYK | cmyk(0%, 52%, 65%, 0%) | |
| NCol | R20, 35%, 0% | |
| OKLCH | oklch(72.9% 0.1696 35.11) |
Lighter / Darker:
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%)
Pick a Color:
Related Color Converters
How to Use This Tool
Enter an RGB color using rgb(r, g, b) notation — for example, rgb(255, 122, 89). The tool converts it to HSL format, expressing hue as a degree (0–360) and saturation and lightness as percentages. HSL output uses standard hsl() CSS syntax, ready to paste directly into your styles. Click any value in the results table to copy it. The shade bar shows HSL values for each tint and shade of your color, making it easy to pick the exact tone you need.