HSL dành cho Hue, Saturation và Lightness khi màu được đặt cho các phần tử. Giá trị Hue là từ 0 đến 260, trong đó 0 hoặc 360 cho màu đỏ, 240 cho màu xanh lam, trong khi 120 cho màu xanh lục. Độ bão hòa và độ sáng là một giá trị phần trăm.
Ví dụ
Bây giờ chúng ta hãy xem một ví dụ cho các giá trị màu HSL -
<!DOCTYPE html>
<html>
<head>
<style>
#demo1 {background-color: hsl(150, 100%, 50%);}
#demo2 {background-color: hsl(150, 100%, 50%);}
#demo3 {background-color: hsl(140, 100%, 40%);}
#demo4 {background-color: hsl(120, 100%, 40%);}
#demo5 {background-color: hsl(120, 100%, 30%);}
#demo6 {background-color:rgba(108,111,35,0.6);}
</style>
</head>
<body>
<h1>Cricketers</h1>
<p id="demo1">David Warner</p>
<p id="demo2">Steve Smith</p>
<p id="demo3">Mark Waugh</p>
<p id="demo4">Steve Waugh</p>
<p id="demo5">David Johnson</p>
<p id="demo6">Andy Bichel</p>
</body>
</html> Đầu ra
