🎨 色值转换工具

色值转换工具能认哪些写法，对比度按什么口径判

五栏色值共用同一个基准色：某栏改成合法写法并离开输入框，其余四栏、取色器、预览块和下面的色阶、配色、批量表一起刷新；每栏右侧「复制」取走规范化后的写法。

哪些写法能被识别？

一次性测了 26 组写法，全部认得出：3/4/6/8 位十六进制（可省 #，如 3B82F6、#3af、#ff000080）、148 个 CSS 命名色（red、royalblue、rebeccapurple，不分大小写，transparent 也算一个）、rgb()/rgba() 的逗号写法和新版空格写法（rgb(255 0 0)、rgb(59 130 246 / 0.5)）、百分比分量（rgb(23% 51% 96%)）、hsl()/hsla() 与 hsv()/hsva()（色相能带 deg/grad/rad/turn，如 hsl(0.6turn 91% 60%)）、cmyk()（带 % 或不带都行），以及裸三分量 59, 130, 246。全角逗号、全角括号、全角百分号和前后空格会先归一化再解析，所以 rgb（255，0，0） 和   #3B82F6   一样能用。那 148 个名字是逐条和浏览器自己算出来的颜色核对过的，取的就是 CSS Color 4 的命名色表。

输入不合法会怎样？

不会悄悄换个颜色。认不出来时输入框描红，下面一行写明到底错在哪（例如「十六进制写了 5 位，只能是 3、4、6、8 位」「红色 300 超出范围（数字 0–255，百分比 0%–100%）」「cmyk 没有透明度写法，去掉最后那一个分量」），五栏色值退回改动之前的那个。19 组非法写法逐组测过，给的都是一条能说清的原因，不是一句「格式错误」。四个数的裸写法（1,2,3,4）会拒收并让你改写成 rgba(r, g, b, 0.5) 或 rgb(r g b / 50%)，因为分不清第 4 个数是不是透明度；hwb() 这类没实现，也直说不认。批量表里非法那行会标红并把同样的原因写在「说明」列，其余行照常转换。

明暗滑杆和透明度滑杆会改掉基准色吗？

不会，它们只改「显示色」，基准色保持不动。状态行会写清楚：基准 #3B82F6 → 显示 #2858A7（透明度 62%） · 明暗 34%（向黑混） · 透明度 62%。五栏色值、色阶、配色方案抄走的都是这个显示色，所以拖完滑杆再复制，值和你眼前看到的对得上；按钮「复位」只在被改过的时候出现，点一下就回到基准色、不透明。明暗 50% 等于不改，往左压向黑、往右提向白。当前状态全部写进地址栏（#c=色值&a=透明度&k=明暗&t=文字色&b=底色&s=配色&p=1），把这串链接发给别人，对方打开就是同一个画面；链接里某个参数写错了会单独说明「这些参数没生效」，其余照常应用。

白色、黑色卡片上的比值和判定是什么口径？

比值就是 WCAG 2.1 的算法：先把颜色算成相对亮度（每通道除以 255，≤0.03928 就除以 12.92，否则取 ((v+0.055)/1.055) 的 2.4 次方，再按 0.2126 / 0.7152 / 0.0722 加权），再算 (亮 + 0.05) / (暗 + 0.05)。判定档位按正文阈值：≥7 正文 AAA、≥4.5 正文 AA、≥3 只够大字 AA（大字指 18pt，或 14pt 粗体），更低就是都不达标。以 #3B82F6 为例，实测白字 3.68 只够大字，黑字 5.71 过正文 AA，所以勾打在黑字卡片上。带透明度时按它的不透明版本计算，因为对比度公式里没有透明度这一项。「底色跟随当前色」不勾时，还可以自己指定底色，做成任意两色的对比度检查。

为什么输入的 HSL 色相回写时可能差 1°？

因为整数写法本身是有损的：8 位 RGB 只有 1677 万多个颜色，而 HSL 三个数各自取整后落回 RGB，色相、饱和度经常差 1° 或 1%。随机取 300 个颜色，把页面显示的整数值原样抄回去：HSL 有 261 个变成了另一个颜色（离原色最多差 3 个 8 位级），HSV 有 263 个（最多差 3），CMYK 有 263 个（最多差 2）。这 787 次变色每一次下面都有一行说明——要么是「你写的 hsl(…) 落到 8 位 RGB 后回到 hsl(…)，差在量化这一步」，要么是「你把这行原样抄回来却换成了另一个色」，实测没有一次闷着改，也没有一次没变却报错。要能原样抄回来，就勾上「HSL / HSV / CMYK 保留一位小数」：同一批 300 个颜色实测 0 个变，抄回来就是同一个色；嫌小数啰嗦可以再取消勾选。

CMYK 数值能直接交给打印店吗？

不建议直接给。这里的 CMYK 是纯公式换算（从 RGB 减出黑版 K，再把剩下的摊到 C/M/Y），不带任何印刷色彩配置文件，也不考虑油墨叠率、网点增益和纸张白，同一串数字上机结果会偏。它适合用来估个量级、看看某个色的四色大致比例；要真印刷，请以打印店给你的 ICC 目标空间和打样为准。另外 CMYK 没有透明度写法：#ff000080 这类带透明度的色，CMYK 栏按不透明版本给值，页面会另行注明透明度。