色阶

同一色相的十一级明度。点击其中一个即可设为当前颜色。

对比度

两种颜色之间的比值，按 WCAG 的定义计算。

把颜色在几种写法之间转换，不过是五行算术。更难的问题是这种颜色的文字究竟能不能读，而回答它需要一个多数工具会跳过的步骤。这两件事都在本页，用的是你输入的同一个颜色。

使用方法

1. 1 用任意写法输入一个颜色，或者使用取色器。
2. 2 复制你需要的那种写法，或点击某个色阶切换过去。
3. 3 看对比度表格。凡是标为“不通过”的组合，总会有人读起来吃力。

为什么同一色相在 HSL 里看起来不同

HSL 会把数值取整到整数度和整数百分比，所以转成 HSL 再转回来，未必能得到你最初的那几个字节。因此本页显示的 HEX 始终由你输入的值推导而来，而不是经 HSL 往返一圈——否则每点一次，颜色就会偏移一小步。

对比度数字是什么意思

比值从两种完全相同颜色的 1:1，到纯黑配纯白的 21:1。下面这些阈值就是本工具据以判断的标准。

多数工具会跳过的那一步

相对亮度并不是各通道数值的平均。每个通道必须先做线性化，因为 HEX 码里的数字是经过伽马编码的，并不与光强成正比。跳过这一步，比值照样会得出一个看起来合理的数字，只是错的；而误差在中间调最大，而界面颜色恰恰大多落在中间调。

对比度是必要条件，不是充分条件

一组配色可以通过 4.5:1，却依然是糟糕的选择：色觉障碍会让某些配色即便在高比值下也难以分辨，而且含义绝不该只靠颜色来传达。把这里的「通过」当作跨过了底线，而不是对设计的最终评判。