HSL
颜色色相-饱和度-亮度色彩模型
HSL 用色相（Hue 0–360°）、饱和度（Saturation %）、亮度（Lightness %）描述颜色，比 RGB 直观、便于程序化配色，CSS 自 CSS3（2011）起原生支持 hsl() 函数。
三个分量的含义
H 是色相环角度：0°/360° 红、60° 黄、120° 绿、180° 青、240° 蓝、300° 品红。S 是色彩纯度，0% 即无彩色灰。L 是亮度，0% 黑、100% 白、50% 是"标准亮度"的纯色。hsl(220,100%,58%) 是典型的明亮蓝，对应 #2B6CFF。
HSL 与 HSV 的区别
HSV（也叫 HSB）第三分量是 Value 明度，纯色的 V=100% 而 L=50%，两者常被混用。HSL/HSV 的几何模型由 Alvy Ray Smith 于 1978 年论文提出（HSV），Tektronix 图形终端推广了 HSL 变体。做设计取色时注意各软件叫法不一：Photoshop 用 HSB，CSS 用 HSL。
为什么设计师爱用它
同一色相下调 S/L 即可生成一套视觉和谐的同色系（主色的 L±10% 做悬停/激活态）；旋转 H 做互补色（±180°）、三角配色（±120°）。设计系统里由主色程序化派生浅/深变体，几乎都用 HSL 数学实现。
局限性
HSL 的"亮度"与感知亮度不一致——黄色在 L=50% 时看起来远比蓝色亮，导致用它算出的配色对比度未必达标（WCAG 校验仍要换算成相对亮度）。感知均匀的现代替代是 OKLCH（CSS Color Level 4，2022 起浏览器支持）。