Easily convert RGB to HSL with this smart and accurate online tool. Perfect for designers, developers, artists, and color enthusiasts, this converter gives you instant and precise HSL output from any RGB color.

This guide also explains how to convert RGB to HSL, including the full RGB to HSL formula and step-by-step calculation.

Color Converter RGB to HSL – Fast & Accurate RGB to HSL Conversion Tool

RGB to HSL color conversion

To convert RGB to HSL, you need to normalize your RGB values (0–255) into decimals (0–1), then apply the RGB to HSL formula to calculate Hue, Saturation, and Lightness.

The formula uses the maximum and minimum values among R, G, and B to determine color properties.

How to Convert RGB to HSL

RGB to HSL color conversion formula

The process of converting RGB to HSL involves four main calculations:

  1. Normalize RGB values

  2. Find C_max and C_min

  3. Calculate Lightness (L)

  4. Calculate Saturation (S)

  5. Calculate Hue (H)

RGB to HSL Color Code Examples

What is RGB to HSL Conversion

RGB (Red, Green, Blue) is a color model used for digital screens.
HSL (Hue, Saturation, Lightness) represents colors in a more human-understandable format.

RGB to HSL conversion means converting screen-based color values into a format that helps with:

  1. Designing UI/UX

  2. Creating themes

  3. Adjusting color brightness

  4. Generating tints & shades

1. Normalize the RGB Values

RGB values range from 0 to 255.
To convert, first normalize each component by dividing by 255.

R' = R / 255
G' = G / 255
B' = B / 255

These normalized values (R', G', B') will range from 0 to 1.

Then, find the maximum(Cmax) and minimum (Cmin) values among R', G', and B'.

2. Find Cmax & Cmin

Lightness represents the brightness of the color.

L = (Cmax + Cmin) / 2

Lightness ranges from 0 to 1 (or 0% to 100%).

3. Lightness Calculation (L):

Determine the highest and lowest value among R', G', and B'.

Cmax = max(R', G', B')
Cmin = min(R', G', B')

Then calculate the difference:

Δ = Cmax – Cmin

4. Saturation Calculation (S):

Saturation depends on the difference between the maximum and minimum values.

If Δ = 0, then S = 0
Else,
S = Δ / (1 – |2L – 1|)

Saturation also ranges from 0 to 1 (or 0% to 100%).

5. Hue Calculation (H):

Hue represents the color angle on a color wheel (0° to 360°).

If Δ = 0, then H = 0
Else if Cmax = R',
H = 60 × [((G' – B') / Δ) mod 6] ,
Else if Cmax = G',
H = 60 × [((B' – R') / Δ) + 2]
Else if Cmax = B',
H = 60 × [((R' – G') / Δ) + 4]

Hue will be between 0° and 360°.

Related Tools:

  • Hex to RGB Converter

  • RGB to HEX Converter

  • HSL to CMYK Converter

More Tools