W3schools.cn 在线教程 - 编程参考手册

HSL 颜色


HSL 计算器


 
rgb(255, 0, 0)
#ff0000


H:
S:
L:

HSL 计算器

IE9+、Firefox、Chrome、Safari 和 Opera 10+ 支持 HSL 颜色值。

HSL 代表色相、饱和度和亮度。

HSL 颜色值通过以下方式指定: hsl(色调, 饱和度, 亮度)


色调

色调是色轮上从 0 到 360 的度数。0 是红色,120 是绿色,240 是蓝色。


饱和度

饱和度是一个百分比值; 0% 表示灰色阴影,100% 表示全色。


亮度

亮度也是一个百分比; 0% 为黑色,100% 为白色。


亲自试一试

所有主要浏览器都支持 HSL 颜色值。

实例

<style>
div {
    background-color: hsl(180, 50%, 50%);
    color: hsl(0, 0%, 100%);
}
</style>

亲自试一试 »