颜色代码转换

在 HEX、RGB、HSL、HSV、CMYK、OKLCH 或 CSS 颜色名中任意一处输入颜色，其他格式会立即更新。可用于把设计稿中的颜色搬到 CSS 中，或检查文字与背景的对比度是否足够。

使用方法

1. 用“选择颜色”选取颜色，或在 HEX、RGB 等任一栏中输入数值。其他栏会随之变化，点击旁边的按钮即可复制任意一项。
2. 设置“不透明度”可增加透明度；此时 HEX 变为 8 位，RGB 变为 rgba。
3. 在“更浅与更深”或“配色方案”中选择一个色块，即可切换到该颜色。
4. 在“对比度检查”中设置“文字颜色”和“背景颜色”，查看“对比度”以及 AA 和 AAA 的判定结果。

计算方式与说明

• HEX 把红、绿、蓝的值（0 到 255）各写成两位十六进制数。例如，rgb(255, 99, 71) 就是 #FF6347。
• 对比度 =（较浅颜色的相对亮度 + 0.05）÷（较深颜色的相对亮度 + 0.05），按 WCAG 2.2 成功标准 1.4.3 和 1.4.6 判定。对比度向下取整。
• CMYK 使用不含印刷配置文件的简单公式，所以实际印刷颜色会有差异。最近使用的颜色和上一次的颜色保存在本设备上。

常见问题

HEX 怎么转 RGB？

把代码两位一组拆开，将每组从十六进制转换为十进制。#3B82F6 得到 3B = 59、82 = 130、F6 = 246，即 rgb(59, 130, 246)。在 HEX 栏中输入即可立即看到。

文字对比度需要达到多少？

WCAG AA 要求普通文字 4.5:1、大号文字 3:1；AAA 要求 7:1 和 4.5:1。大号文字指至少 24px，或粗体 18.66px。

3 位 HEX 颜色代码是什么？

它是 6 位代码的简写，每一位重复一次。#F80 与 #FF8800 是同一种颜色。

能告诉我颜色的名称吗？

如果颜色与 148 个 CSS 颜色名之一相同，就会显示该名称；否则会显示最接近的 CSS 颜色名及其 HEX 值。