如今，无障碍性非常流行，尤其是在颜色对比方面。本周我偶然发现了一些我认为非常棒的工具，可以帮助确保我们网站上的所有文本无论其背景颜色如何都清晰易读。
首先是 无障碍颜色生成器，它是一个用于选择替代颜色的绝佳工具。假设您正在处理一个使用颜色 X 的品牌。您可以像这样生成许多其他互补颜色
接下来是 Contrast，这是一个非常棒的 macOS 应用，始终驻留在菜单栏中，并根据 WCAG 指南帮助识别可访问的颜色配对。如果您碰巧是一名设计师，此工具特别有用
这让我想起了关于 Lyft 设计团队如何重新审视他们在其应用中使用颜色方式的一篇精彩文章。 Kevyn Arnott 解释道
颜色，至少从表面上看，似乎近乎天真地简单，但随着它在更大的产品中扩展，它变得难以置信地复杂。有数千人同时构建产品，而这些产品都严重依赖颜色。这给颜色系统带来了很大压力，要求确保所有产品都以一致的方式创建，但由于在个别情况下应用颜色过于容易，因此很难实施。
然后，该团队继续构建了 ColorBox.io，它允许您系统地为您的设计系统工作构建大量颜色。它非常棒！
此外，GOV.UK 的人员制作了自己的颜色无障碍工具，名为 Contrast Checker，它（正如您从名称中猜到的那样）有助于检查元素背景与页面本身之间的对比度
当然，还有可靠的 WebAIM 对比度检查器，它是许多开发人员的首选工具。
即使 DevTools 也可以通过查看其中的颜色来告诉您有关颜色对比的信息。
到目前为止，我们已经了解了检查对比度的工具。但是，有一类工具可以在开发过程中自动执行可访问的对比度。Josh Bader 写了一篇文章介绍了一种方法，该方法通过将 CSS 自定义属性与 calc() 函数配对来强制执行高对比度。Facundo Corradini 做了类似的事情，即 根据其后面的背景颜色切换字体颜色。
哦！而且我们可能需要期待一下 color-adjust 属性。它在 CSS 颜色模块级别 4 规范中提出，可以为浏览器提供更多控制权来调整在样式表中声明的颜色值。它并不是真正针对颜色对比度，但根据某些条件将渲染颜色值的责任交给浏览器这一点很有趣。
@jxnblk 的 Colorable http://jxnblk.com/colorable/demos/text/ 也是一个不错的选择！
另一个很棒的工具：Contraste。
你错过了我最喜欢的两个！
Lea Verou 的 contrast-ratio.com 处理几乎任何颜色格式，并为具有 alpha 值的颜色生成 +/- 范围。
然后，Chrome 的颜色对比度分析器插件可以可视化屏幕上任何内容的对比度，允许您测试细字体、渐变上的文本、图像上的文本、带有文本阴影的文本以及其他任何内容的实际对比度！
如果您想测试 rgba 或 hsla，我发现唯一支持它们的工具是 Lea Verou 的 – https://contrast-ratio.com/
这里似乎提到了几个用于颜色对比无障碍性的好工具。Robin 做了很好的研究，我不知道这个工具的存在：无障碍颜色生成器。我刚刚尝试了一下，我可能会开始使用它。谢谢！
您好，
感谢您的文章！
其他颜色对比度检查器：https://github.com/atalan/a11y-resources/blob/master/list-of-a11y-resources.md#colors–colors。
WebAIM 浏览器插件（FF 和 Chrome – https://wave.webaim.org/extension/）非常方便，比它们的网页更有效，当这些插件出现故障时，网页仍然非常棒。