C值无理论上限，因其是CIELAB中√(a²+b²)的欧氏距离，但受显示器色域、浏览器截断和人眼非线性三重限制，实际有效上限需实测目标设备与浏览器组合。
C 值没有理论上限，是因为它定义在 CIELAB 色彩空间中，本质是色度（chroma）的欧几里得距离：C = √(a² + b²)，而 a、b 在数学上可无限延伸——但屏幕、浏览器、色域会立刻把它砍掉。
lch() 的 C 是什么，不是什么
C 不是“饱和度百分比”，也不是“越大力越鲜艳”的滑块。它是 CIELAB 中从 L 轴垂直向外的距离，单位是“无量纲感知单位”。理论上，只要 a 和 b 足够大，C 就可以无限大；但现实里，它受限于三重物理与实现边界：
- 显示器色域：sRGB 屏幕的 a/b 范围约 [-128, 127]，P3 屏更宽，但仍有硬边界
- 浏览器 clamp 行为：Chrome/Safari/Firefox 遇到超出当前 L/H 组合可表达范围的 C，会静默截断（clamped）或 fallback 到灰阶，不报错也不警告
- 人眼视觉非线性：C=200 和 C=250 在多数场景下根本看不出区别，反而更容易触发 banding 或插值失真
为什么你写 lch(60% 200 240) 却看不到“更蓝”
常见错误现象：lch(60% 200 240) 在 Chrome DevTools 颜色 picker 中拖动 C 滑块超过 115 后，预览色块突然变灰、跳变或边缘发虚——这不是 bug，是浏览器主动降级到了 sRGB 插值路径。
- 同一 H 下，不同 L 对应的最大安全 C 差异极大：L=30% 时，C > 70 就可能溢出；L=60% 时，C=110 是多数 LCD 的临界点
- 青绿区间（H≈140–180）对高 C 最敏感，C=120 在 H=160 时极易被 clamp，但在 H=0（红）可能仍正常显示
- Firefox 120 及更早版本对高 C 值支持更保守，
lch(50% 130 160)在它里面常被渲染为近似lch(50% 90 160)
真正该关心的不是“上限”，而是“有效上限”
所谓“有效上限”，是你在目标设备+浏览器组合下，能稳定还原、无 banding、无色偏、且 WCAG 对比度达标的最高 C 值。它必须实测，不能查表。
立即学习“前端免费学习笔记（深入）”；
- 用
background-color: lch(60% 115 240)写一个全屏 div，在 Chrome/Safari/Firefox 中分别打开 DevTools → 点击颜色值 → 切换到 LCH 视图 → 手动拖 C 滑块，观察预览是否平滑、有无突然变灰 - 连真机测试：MacBook Pro（P3）和 iPhone 15（P3）上 C=125 可能正常，但同 CSS 在 ThinkPad X1 Carbon（sRGB）上直接变脏蓝
- 深色模式下，高 C 更危险：
lch(85% 110 270)在lch(20% 0 0)背景上对比度可能跌破 4.5:1，此时微调 L 比压 C 更有效
别盯着“C 能不能到 300”，盯住你用户真正在用的设备和浏览器——那个数字，才是你代码里真正能活下来的 C。
