lch()不是rgb升级版，而是基于cielab的感知导向坐标系：l为感知明度（0–100），c为色度（饱和度强度），h为色相角（0–360°），三者正交且设备无关，调l不偏色、调h不改变亮度，支持广色域显示。
lch() 不是 RGB 的“升级版”，而是另一套坐标系
RGB 描述的是显示器怎么发光：三个通道分别控制红、绿、蓝子像素的强度（0–255），本质是加色模型的物理实现。lch() 则完全不碰设备通道，它基于 CIELAB 空间，把颜色表达为 L（明度）、C（色度）、H（色相）——这三个值对应人眼感知维度，不是硬件驱动信号。
调 L 值时，RGB 会偏色，lch() 才真“只调亮暗”
在 rgb(255, 0, 0)（纯红）上改亮度，你只能靠降低所有通道或叠加黑/白层，结果要么发灰、要么失饱和；而 lch(60% 85 20) 调成 lch(40% 85 20)，色相和鲜艳度保持不变，只是视觉变暗——因为 L 是 CIE 定义的感知明度标尺，不是 RGB 极值平均值。
-
hsl(0, 100%, 50%)和hsl(120, 100%, 50%)的视觉亮度差三倍，但lch(50% 70 0)与lch(50% 70 120)在同一显示器上才真正等亮 - RGB 没有统一的“亮度轴”，
L在 lch() 中是独立且感知线性的，前提是显示器支持对应色域（如 P3）
浏览器解析 lch() 时会静默降级，RGB 不会
写 color: rgb(100, 180, 255); color: lch(70% 85 250);，旧版 Safari（如 15.x）遇到不识别的 lch() 会直接丢弃整条声明，回退到继承色或透明——不是变灰，是“消失”。而 rgb() 全版本兼容，无任何风险。
- 必须前置声明 fallback：
background-color: rgb(100, 180, 255); background-color: lch(70% 85 250); -
@supports (color: lch(0 0 0))在部分 Safari 版本中误报，不能依赖它做关键路径的颜色切换 - PostCSS 自动转译已不可靠，
lch()的色相圆周逻辑（如 355°→5°）需手动拆段，工具无法智能处理
色域覆盖能力根本不在一个量级
rgb() 固定绑死 sRGB 色域，再高的数值也会被 clamp 到边缘；lch() 可激活 DCI-P3 或 Adobe RGB 显示器上的高饱和青绿、洋红区域——比如 lch(60% 125 160) 在 MacBook Pro 上呈现的青色，远超 hsl(160, 100%, 50%) 或任何 rgb() 组合所能表达的鲜活度。
- 但别盲目拉高
C：LCD 屏幕在L=50–70区间，C > 110就容易 banding；OLED 可试到 130，仍需真机验证 -
L=0%或L=100%时，C强制归零——这和hsl(160, 100%, 0%)还保留色相语义完全不同 - Figma 默认用 D50 白点，而 CSS
lch()解析用 D65，青绿区间色相偏移 3–5°，rgb()和hsl()无此问题
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
