HSL to RGB Conversion

HSL to RGB Conversion

It is a color code conversion calculator that is used to convert the hue in degrees (˚), saturation and lightness (HSL) to red, green and blue colors (RGB). The saturation and lightness are usually expressed as a percentage on a scale of 0 to 100%. To use the calculator, enter the hue, saturation, and lightness in their blank text fields respectively. Click on the ‘Convert' button to initiate the conversion. This displays the RGB hex code, red, green and blue colors below the two controls. The ‘Reset' button is used when you have new values in HSL or you want to alter values. It erases all data from the calculator with a single click. The bottom panel highlights the color preview of the red, green and blue colors.

For example

Convert 60 degrees Hue, 40% saturation and 70% lightness to RGB.

Solution

First, enter the HSL values 60, 40 and 70 in their blank text fields respectively. Click the ‘Convert' button to initiate the conversion. The result will be displayed as;

RGB hex code# - D1D194

Red color (R) – 209

Green color (G) – 209

Blue Color (B) – 148

The bottom panel will also show the color preview of the above RGB values.

Formula used in converting HSL to RGB

When 0 ≤ H < 360 (0 is less than or equal to Hue and less than 360), 0 ≤ S ≤ 1 (0 is less than or equal to saturation which is less than or equal to 1) and 0 ≤ L ≤ 1 (0 is less than or equal to lightness and less than or equal to 1);

C = (1 - |2L - 1|) × S

X = C × (1 - | (H / 60°) mod 2 - 1|)

m = L - C/2

(R, G, B) = ((R'+ m) ×255, (G'+ m) ×255, (B'+ m) ×255)