拖动滑块调整HSL值,实时预览转换结果。支持复制RGB、HEX和CSS代码。
色相 (Hue):0°=红色,120°=绿色,240°=蓝色,360°=红色(回到起点)。
饱和度 (Saturation):0%=灰色(无色相),100%=最鲜艳的纯色。
亮度 (Lightness):0%=纯黑,50%=正常亮度,100%=纯白。
HSL使用色相(Hue)、饱和度(Saturation)、亮度(Lightness)三个维度描述颜色,更符合人类对颜色的直观感知。RGB使用红绿蓝三原色叠加描述颜色,更接近显示器的物理原理。HSL更适合设计调色,RGB更适合编程使用。本工具帮您在两种格式间自由转换。
色相H取值范围0-360度(0=红色,120=绿色,240=蓝色),饱和度S取值范围0%-100%(0%=灰色,100%=纯色),亮度L取值范围0%-100%(0%=黑色,50%=正常,100%=白色)。
是的。本工具使用标准的HSL到RGB数学公式进行转换,结果与CSS color: hsl() 函数的渲染效果完全一致。RGB值四舍五入到整数。
当然可以。转换结果可以直接用于CSS的 rgb() 或 #hex 颜色值。工具还提供一键复制CSS代码功能,方便直接粘贴到你的样式表中。