CSS中，调整亮度和饱和度时，HSL颜色模型更直观方便？

本文共计702个文字，预计阅读时间需要3分钟。

当您需要系统性地调整一组颜色的明暗、鲜艳程度，或者基于某个主色调生成深浅变化（如主题色、渐变色、禁用态等）时，使用 `hsl()` 是更可控的选择。

它将颜色为三个独立维度：

hsl() 的 lightness 和 saturation 为什么比 rgb() 直观？

lightness 是从黑（0%）到白（100%）的中间轴，50% 就是“标准亮度”；saturation 是纯色（100%）到灰（0%）的线性变化。