Date 2025-12-10 16:15:55
推荐这篇文章「Color.review」用于计算两种颜色的对比度，检查是否符合要求 WCAG 2.1 标准化的在线工具，也能帮助用户找到好看又适合每个人的色彩组合， Color.review 无需下载软件或应用程序，直接用浏览器打开即可使用，产生相应的共享链接，为他人提供检测结果的参考。
Color.review 使用 RGB、HSL、CMYK 和 CSS 将颜色放入格式中，还有一篇带有标题、内文和图片的示例文章用于预览配色。除了显示计算后两种颜色的对比值外，还可以找到符合要求的 WCAG 标准的颜色(详细说明后面的文章)。
颜色可以在很大程度上影响设计作品的色调和美观。如果你想掌握设计作品的色调，选择合适的色彩搭配组合尤为重要。因此，葱花了两天时间整理出来 19 大设计调性，多达 160 在紧急情况下，快速收集配色方案。
阅读文章 >网站链接：https://color.review/
使用教学
开启 Color.review 网站后面会有预设的颜色，主要是从右边调整前景和背景颜色，检查上面显示的内文和标题是否符合要求 WCAG 最好将规范的对比度设置为两个值都是绿色的 AAA，如果没有，至少两个值都应该显示为绿色(对比度) 4.5 以上）。
右上角会有 RGB、HSL、CMYK 或 CSS 颜色格式，选择你习惯的格式。
例如，我设置了左上角显示的前景和背景颜色的对比度 4.1，然后从上面看到文本部分没有通过 WCAG 2.1 标准化，显示为红色 FAIL，在这种配色情况下，内文可能不容易阅读(但标题不会因为字体大而受到影响)。
向下滚动网页会看到实际应用于文章或图案中的前景和背景色的效果，左侧会显示是否符合要求 WCAG 2.1 以及评分为 AA 或是 AAA，可以看出，在这种配色中，只有标题是通过的，而内文部分是连接的 AA 没有达到评级。
那怎么用呢？ Color.review 调整到符合 WCAG 2.1 规范的对比度如何？
你看到调色盘里有三条线吗？它们对应于不同的对比度。例如，下图从上到下分别为 3、4.5 和 7、只要调整颜色到调整颜色 4.5 – 7 内文和标题的评级可以绿色通过(如果需要两者都达到) AAA 等级，要把颜色拉到底线才能有足够的对比度)。
对比度在微调后提高到 4.5，也符合要求 WCAG 2.1 对比度(内文为 AA、标题 AAA），它看起来离原来的颜色不远。如果你想调整网页的颜色，这样它就可以让普通用户顺利阅读。事实上，微调配色需要一些时间是非常重要的！
有三个原因值得一试：
检查在线色彩对比度测试工具是否符合要求 WCAG 2.1 标准设置前景色，背景色应用于示例文章查看标题和内部风格的比较 3、4.5 和 7 帮助用户找到更合适的颜色组合