速查在线工具箱

颜色预览简介

颜色预览工具可快速查看多种颜色值的视觉效果，支持 HEX、RGB、颜色名等格式输入，每行一个颜色，点击色值即可复制，适用于设计配色参考与前端开发调色。

对比度检测基于 WCAG 2.1 标准，输入前景色与背景色即可计算对比度比值，并判断是否满足 AA（普通文本 ≥4.5、大文本 ≥3.0）与 AAA（普通文本 ≥7.0、大文本 ≥4.5）可读性标准，帮助设计师确保文字在背景上清晰可读、符合无障碍规范。

颜色历史会自动记录你预览过的颜色（本地保存），常用色板提供一组精选配色，点击即可快速填入。所有处理均在浏览器本地完成，不上传任何数据。

如何使用本工具？

1. 在"颜色预览"框中输入颜色值（每行一个），点击"预览颜色"。

2. 在"对比度检测"中选择或输入前景/背景色，实时查看 WCAG 合规结果。

3. 点击任意色块或历史记录，可快速复制或回填颜色值。

常见问题与解答

什么是 WCAG 对比度？

WCAG（Web 内容无障碍指南）定义了文字与背景的对比度门槛，确保弱视用户也能阅读。对比度 = (较亮颜色相对亮度 + 0.05) ÷ (较暗颜色相对亮度 + 0.05)。

支持哪些颜色格式？

支持十六进制（#1890ff）、RGB（rgb(24,144,255)）以及 140+ 种 CSS 颜色名（如 orange、rebeccapurple），由浏览器内核统一解析。

最新工具