Skip to main content

RGB to HSL Converter

Convert RGB colors to HSL instantly. Enter integer or percentage RGB channels, preview the color, and copy hue, saturation, and lightness formats.

Your tool input is processed locally in your browser—not uploaded to or stored by Bitty Coder. Privacy Policy

HSL channels

ValueHueSaturationLightness
HSL0%0%

HSL formats

  • hsl(0, 0%, 0%)
  • hsl(0 0% 0%)
  • 0, 0%, 0%
  • 0 0% 0%

What is an RGB to HSL converter?

An RGB to HSL converter changes red, green, and blue channel values into hue, saturation, and lightness. It keeps the same sRGB color while making its color family and tonal properties easier to inspect separately.

How to convert RGB to HSL

  1. Enter rgb(255, 87, 51), raw 0–255 channels, or RGB percentages.
  2. Check the color preview and HSL channel values.
  3. Copy the comma-separated, space-separated, CSS, or raw HSL format.

RGB to HSL example

For RGB 255, 87, 51, normalize each channel to 0–1, then identify the largest and smallest values. Their midpoint gives lightness, their difference determines saturation, and the largest channel determines the hue formula.

rgb(255, 87, 51) → hsl(10.6 100% 60%)

The displayed HSL channels use up to one decimal place.

RGB to HSL formula

Let max and min be the largest and smallest normalized RGB channels:

Lightness = (max + min) ÷ 2
Delta = max − min

When delta is zero, the color is gray and saturation is 0%. Otherwise saturation and hue are calculated from delta, lightness, and the largest channel.

RGB vs. HSL

RGB maps directly to display channels and graphics APIs. HSL separates hue, saturation, and lightness for easier manual adjustment, but it is not perceptually uniform.

Use the HSL to RGB Converter for the reverse direction. Use RGB to HEX Converter when you need a compact hexadecimal value.

RGB to HSL FAQ

What RGB ranges are accepted?

Use integer channels from 0 to 255 or percentages from 0% to 100%. Bare normalized 0–1 input is not inferred.

Why is gray reported with a hue of zero?

When saturation is zero, changing hue does not change the displayed gray. Zero is used as a stable normalized value.

Why does the HSL result contain decimals?

Most RGB combinations do not produce whole degrees and percentages. The display keeps up to one decimal place.

Does RGB to HSL change the color?

No. It changes the notation. Converting rounded HSL values back can occasionally move an RGB channel by one unit.

Can I convert rgba()?

No. Plain HSL does not preserve alpha, so rgba() and slash-alpha input are rejected.