色彩实验室

功能

• 混色：RGB 线性与 OKLab 两种口径并列给出，直接看出差别
• 变深 / 变浅：可切 OKLCH 的 L（感知）或 HSL 的 L（几何）
• 色阶：加白 tints、加黑 shades，或在 OKLCH 下做等明度阶梯
• 色差 ΔE：CIE76、CIE94、CIEDE2000 三种口径，可单选或全给
• 排序：按色相、明度、饱和度或 WCAG 感知亮度重排一组颜色
• 色环几何：中间色、分裂互补、三等分、类似色
• 一行一个色值，支持 #hex、rgb()、hsl() 与 CSS 颜色名
• 每个结果都画一块色块，并给出 hex / rgb / hsl 三种写法
• 逐行复制，或一次复制全部
• 全部在本机计算，页面不发送任何请求

使用方法

1. 一行一个地输入色值（混色、色差至少两行）
2. 选模式：混色 / 变深变浅 / 色阶 / 色差 / 排序 / 色环几何
3. 按模式调整比例、幅度、档数或口径
4. 结果实时出现，点行末复制取走需要的色值

常见问题

RGB 线性混合与 OKLab 混合到底差在哪？

RGB 线性混合在三个通道上各自取中间值，这是显示器把两个像素叠在一起的做法。它的毛病是中间会经过灰：红与绿各一半得到 `#808000`，一个暗而浊的橄榄色。OKLab 混合先把颜色换算到感知均匀的 OKLab 再插值，中间不会掉进灰里 —— 红与绿得到更亮的黄。做渐变、混色、取中间色时，OKLab 的结果更接近人期待的「两色之间」，所以现代设计工具默认用它。

变浅为什么有两个口径？

OKLCH 的 L 是感知上的明度，把 L 推向 1 得到另一种同色相的浅色，饱和的色相基本保得住，这是设计工具的默认做法。HSL 的 L 是几何意义上的明度，把 L 推向 100 会把颜色洗白：青、蓝、洋红这类靠近色相环端点的高饱和色会先掉彩度，越调越灰。两个口径都留着，因为「洗白」有时正是你要的效果。

三种色差口径该看哪一个？

CIE76 就是 Lab 空间里的欧氏距离，最简单也最粗糙。CIE94 补上了彩度与色相的加权，是平面设计常用的折中。CIEDE2000 最贴近人眼，加了色相旋转项，是目前 ΔE 里的推荐口径。可辨阈值大致是：ΔE<1 看不出，1–2 受过训练的人看得出，>5 是明显不同的两个颜色 —— 但这个阈值随口径不同会略有出入，比较时请用同一个口径。

支持哪些输入写法？

一行一个：`#hex`（3 位或 6 位）、`rgb()`、`hsl()`，以及 CSS 颜色名（如 `tomato`）。解析复用本站「颜色格式转换」的同一份代码，所以那边认的那边这里也认。认不出的那一行会报出来，不会静默丢掉。