取色器与对比度检查
用取色器选择颜色，或以任意格式输入。可查看 HEX、RGB、HSL、HSV 和 CMYK 值，获取浅色、深色和配色，并检查两种颜色的文字是否符合 WCAG 无障碍对比度标准。
颜色
关于取色器与对比度检查
用取色器选择颜色，或以任意格式输入。可查看 HEX、RGB、HSL、HSV 和 CMYK 值，获取浅色、深色和配色，并检查两种颜色的文字是否符合 WCAG 无障碍对比度标准。
属于 SmartCalcy“文件、图片与设计”板块。它在你的浏览器中运行，无需账号，使用你自己的货币和单位（可在页面顶部更改），所给结果仅为估算、仅供参考，因此在依赖结果之前请查阅官方指引。
如何使用取色器与对比度检查
它计算什么，何时使用
选取颜色并在 HEX、RGB、HSL、HSV 和 CMYK 之间转换，推荐浅色、深色和配色，并按 WCAG 无障碍指南检查文字对比度。
使用步骤
- 用取色器选择颜色，或以 HEX、RGB、HSL 或颜色名称输入。
- 选择用于检查对比度的背景色。
- 一键复制任意格式。
- 用浅色、深色和配色组成调色板。
各输入项的含义
- 颜色 – 默认为 #2443C8，即 SmartCalcy 蓝。
- 背景 – 默认为白色。
如何阅读结果
- 对比度 – 从 1:1 到 21:1，并给出普通文字和大号文字的 AA 和 AAA 结果。
- 格式 – HEX、RGB、HSL、HSV 和 CMYK。
- 浅色与深色 – 更浅和更深的版本。
- 配色 – 互补色、类似色和三角配色。
公式
对比度 = (L1 + 0.05) ÷ (L2 + 0.05)，其中 L1 和 L2 分别是较浅和较深颜色的相对亮度。WCAG AA 要求普通文字 4.5:1、大号文字 3:1；AAA 要求 7:1 和 4.5:1。
计算示例
使用默认颜色时，白底上的 #2443C8 对比度为 7.74:1，所有文字大小均通过 AAA。
假设与局限
- CMYK 值为简单换算，并非经过色彩管理的印刷配置文件。
- 对比度结果采用 WCAG 2 公式。
常见错误
- 只按大号文字检查对比度，却把该颜色用于小号文字。
- 仅靠颜色来传达含义。
常见问题
需要多大的对比度？
要符合 WCAG AA，普通文字至少 4.5:1，大号文字至少 3:1。
大号文字有特定尺寸吗？
有：至少 24 px，或粗体约 18.7 px。
可以输入颜色名称吗？
可以，任何 CSS 颜色名称（如 teal 或 tomato）都可以。
相关工具
#2443C8rgb(36, 67, 200)
对比度
7.74:1
所有文字均通过 AAA。
大号文字，24 px16 px 的普通正文看起来是这样。
| 级别 | 普通文字 | 大号文字 |
|---|---|---|
| AA | 通过 | 通过 |
| AAA | 通过 | 通过 |
格式
- HEX
- RGB
- HSL
- HSV
- CMYK
浅色与深色
配色
互补色
类似色
三角配色