RGB to HSL Converter
Convert an rgb() triplet to HSL to see the hue, saturation and lightness behind it — the model that actually lets you lighten, darken or desaturate predictably.
Live Preview
rgb(37, 99, 235)
hsl(221, 83%, 53%)
Popular color conversions
About RGB to HSL Converter
RGB to HSL conversion remaps screen-oriented red/green/blue channels into hue, saturation, and lightness — a model that matches how people think about tint, tone, and shade.
Enter R, G, and B values or pick a color. Read the HSL output and copy hsl(h, s%, l%) into modern CSS.
rgb(37, 99, 235) → hsl(217, 91%, 60%)
HSL is excellent for programmatic palettes. Change lightness to generate softer backgrounds from the same brand hue.
Need all formats at once? Open the full Color Converter, or read the HEX to RGB CSS guide.
Frequently Asked Questions
Do I need RGB to HSL for accessibility contrast checks?
WCAG contrast formulas work from RGB channels (via relative luminance), not HSL. If you're designing in HSL, convert to RGB first before checking contrast ratios with a WCAG tool.
Why does the same RGB color look different in HSL on other sites?
Rounding conventions differ — some tools round hue to the nearest degree and saturation/lightness to the nearest whole percent, others keep one decimal place. The underlying color is identical; only the displayed precision changes.
Can RGB to HSL conversion fail for grayscale colors?
No, but hue becomes mathematically undefined when R, G, and B are equal (pure gray). This tool reports hue as 0° for grays, which is harmless since saturation is 0% and hue has no visible effect.
Are my RGB values sent anywhere?
No. All math runs locally in your browser.