颜色对比度检查与计算
标题 Title
内容行 1
内容行 2
对比度8.11:1
✓AA 普通文本
✓AA 大文本
✓AAA 普通文本
✓AAA 大文本
文字颜色
HEX
#F2F2F3RGB
rgb(242, 242, 243)RGBA
rgba(242, 242, 243, 1)HSL
hsl(240, 4%, 95%)HSLA
hsla(240, 4%, 95%, 1)CSS 变量
--color: #F2F2F3背景颜色
HEX
#544545RGB
rgb(84, 69, 69)RGBA
rgba(84, 69, 69, 1)HSL
hsl(0, 10%, 30%)HSLA
hsla(0, 10%, 30%, 1)CSS 变量
--color: #544545 功能特点
🔍
WCAG 标准验证
自动检测AA和AAA级别的对比度合规性
⚡
实时预览
即时预览颜色组合效果
🎨
多格式输出
支持HEX、RGB、HSL、CSS变量等多种格式
🔄
一键复制
快速复制各种格式的颜色值
使用教程
- 1
输入或选择文字颜色(前景色)
- 2
输入或选择背景颜色
- 3
查看对比度结果和WCAG合规状态
常见问题
什么是WCAG对比度标准?
WCAG 2.1要求AA级别普通文本对比度至少4.5:1,大文本至少3:1;AAA级别要求普通文本7:1,大文本4.5:1。
大文本的定义是什么?
大文本指粗体18.66px或更大,或普通24px或更大的文本。
透明度会影响对比度吗?
根据WCAG规范,对比度计算不考虑透明度,仅基于RGB值计算。