免费对比度检查器
检查文本和背景颜色的对比度是否符合WCAG 2.1无障碍标准。
94,217+ tools.contrast-checker.input.counter
tools.contrast-checker.output.contrastRatio
17.06:1
tools.contrast-checker.output.largeTextPreview
tools.contrast-checker.output.normalTextPreview
tools.contrast-checker.output.smallTextPreview
tools.contrast-checker.output.reversedPreview
tools.contrast-checker.output.aaNormal
tools.contrast-checker.output.aaNormalReq
tools.contrast-checker.output.aaLarge
tools.contrast-checker.output.aaLargeReq
tools.contrast-checker.output.aaaNormal
tools.contrast-checker.output.aaaNormalReq
tools.contrast-checker.output.aaaLarge
tools.contrast-checker.output.aaaLargeReq
tools.contrast-checker.input.ctaText
tools.contrast-checker.input.ctaButton什么是对比度检查器？
对比度检查器计算文本颜色和背景颜色之间的对比度。足够的颜色对比度对于确保所有用户（包括视觉障碍者）能够阅读内容至关重要。
WCAG要求普通文本至少4.5:1、大文本至少3:1的对比度。本工具即时计算对比度并显示AA/AAA合规状态。
tools.contrast-checker.wcagLevels.title
tools.contrast-checker.wcagLevels.aaNormal
tools.contrast-checker.wcagLevels.aaNormalRatio
tools.contrast-checker.wcagLevels.aaNormalDesc
tools.contrast-checker.wcagLevels.aaLarge
tools.contrast-checker.wcagLevels.aaLargeRatio
tools.contrast-checker.wcagLevels.aaLargeDesc
tools.contrast-checker.wcagLevels.aaaNormal
tools.contrast-checker.wcagLevels.aaaNormalRatio
tools.contrast-checker.wcagLevels.aaaNormalDesc
tools.contrast-checker.wcagLevels.aaaLarge
tools.contrast-checker.wcagLevels.aaaLargeRatio
tools.contrast-checker.wcagLevels.aaaLargeDesc
对比度建议
tools.contrast-checker.tips.tip1
浅灰色背景有时比纯白更护眼。
tools.contrast-checker.tips.tip2
浅色模式对比度好不代表暗色模式也好。两者都要测试。
tools.contrast-checker.tips.tip3
为色盲用户同时使用图标、下划线、粗体等。
tools.contrast-checker.tips.tip4
tools.contrast-checker.tips.tip4Desc
tools.contrast-checker.tips.tip5
tools.contrast-checker.tips.tip5Desc
tools.contrast-checker.tips.tip6
tools.contrast-checker.tips.tip6Desc
对比度检查器：Kleap vs 替代方案
| 功能 | Kleap | WebAIM | Coolors | tools.contrast-checker.comparison.adobeColor |
|---|---|---|---|---|
| 价格 | 完全免费 | 免费 | 免费/付费 | tools.contrast-checker.comparison.priceAdobe |
| tools.contrast-checker.comparison.realTimePreview | tools.contrast-checker.comparison.realTimePreviewKleap | tools.contrast-checker.comparison.realTimePreviewWebaim | tools.contrast-checker.comparison.realTimePreviewCoolors | tools.contrast-checker.comparison.realTimePreviewAdobe |
| tools.contrast-checker.comparison.colorSuggestion | tools.contrast-checker.comparison.colorSuggestionKleap | tools.contrast-checker.comparison.colorSuggestionWebaim | tools.contrast-checker.comparison.colorSuggestionCoolors | tools.contrast-checker.comparison.colorSuggestionAdobe |
| WCAG级别 | AA和AAA | AA和AAA | 仅AA | tools.contrast-checker.comparison.wcagLevelsAdobe |
| 网站构建器 | 内置AI构建器 | 无 | 无 | tools.contrast-checker.comparison.websiteBuilderAdobe |
| tools.contrast-checker.comparison.swapColors | tools.contrast-checker.comparison.swapColorsKleap | tools.contrast-checker.comparison.swapColorsWebaim | tools.contrast-checker.comparison.swapColorsCoolors | tools.contrast-checker.comparison.swapColorsAdobe |
| tools.contrast-checker.comparison.randomPair | tools.contrast-checker.comparison.randomPairKleap | tools.contrast-checker.comparison.randomPairWebaim | tools.contrast-checker.comparison.randomPairCoolors | tools.contrast-checker.comparison.randomPairAdobe |