Online Calculators & Tools




HSL to RGB color conversion or converter

Enter hue in degrees (°), saturation and lightness (0..100%) and press the Convert button:



Enter hue (H): °  
Enter saturation (S): %  
Enter lightness (L): %  
   
 
RGB hex code (#):  
 
Red color (R):  
 
Green color (G):  
 
Blue color (B):  
 
Color preview:  



What is the difference between RGB & HSL and how to use it


Hex and rgb are just two different ways of defining a color, so the syntax is the only thing that differs. ... HSL stands for 'Hue, Saturation, Lightness' - it builds on RGB and let's you create a model of a color that consists of not just the hue (the 'color'), but also the saturation and lightness.


HSL to RGB conversion formula with chart


When 0 ≤ H < 360, 0 ≤ S ≤ 1 and 0 ≤ L ≤ 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)




HSL to RGB color table


Color Color

name

(H,S,L) Hex (R,G,B)
  Black (0°,0%,0%) #000000 (0,0,0)
  White (0°,0%,100%) #FFFFFF (255,255,255)
  Red (0°,100%,50%) #FF0000 (255,0,0)
  Lime (120°,100%,50%) #00FF00 (0,255,0)
  Blue (240°,100%,50%) #0000FF (0,0,255)
  Yellow (60°,100%,50%) #FFFF00 (255,255,0)
  Cyan (180°,100%,50%) #00FFFF (0,255,255)
  Magenta (300°,100%,50%) #FF00FF (255,0,255)
  Silver (0°,0%,75%) #BFBFBF (191,191,191)
  Gray (0°,0%,50%) #808080 (128,128,128)
  Maroon (0°,100%,25%) #800000 (128,0,0)
  Olive (60°,100%,25%) #808000 (128,128,0)
  Green (120°,100%,25%) #008000 (0,128,0)
  Purple (300°,100%,25%) #800080 (128,0,128)
  Teal (180°,100%,25%) #008080 (0,128,128)
  Navy (240°,100%,25%) #000080 (0,0,128)