OKLCH 调和工作台

三步生成 OKLCH 调和

感知均匀空间的调和不挑角度——每一步都能实时看到对比度与色域映射。

1. 01

   选基础色与规则

   输入或随机一个 HEX，选互补、分裂互补、三角、四方、邻近或单色系。

2. 02

   逐色微调

   每根衍生色都有 L/C/H 三滑块，在感知均匀空间里独立调整；超出色域自动映射到最近可显示色。

3. 03

   导出落地

   实时查看 vs 黑白对比度，复制 CSS 变量或 JSON，或整组送进色板编辑器继续打磨。

调和工作台常见问题

关于 OKLCH 调和的三个高频问题。

OKLCH 调和和普通色轮调和有什么区别？

HSL 的“相同明度”在视觉上并不相等——旋转色相后黄色刺眼、蓝色发闷。OKLCH 是感知均匀空间，色相旋转时明度与彩度真实一致，衍生色天然更均衡。

滑块调出屏幕外颜色怎么办？

OKLCH 色域比 sRGB 大，个别高彩度组合无法在屏幕显示。工作台会自动把超出色域的值映射到最近的可显示颜色，看到的 hex 就是最终可用的。

怎么把结果用到项目里？

导出区可直接复制 :root CSS 变量或 JSON；点“进色板编辑器”可以把整组色带入编辑器继续加锁、重摇并导出 PNG/ASE 等格式。

拿到结果之后

从这里继续，把颜色用出来。