标题示例
副文案可读性预览
背景色: #eefbf5
前景(文字)色: #000000
对比度: 19.75 : 1
随机生成「背景 + 黑/白前景」组合直至满足所选对比度阈值;亦可输入背景色,自动在纯黑与纯白中选对比更强的一侧。
选择一个色系后,生成一组满足所选 WCAG 阈值的背景色卡;文字色会自动在黑白中取对比更高的一侧。
标题示例
副文案可读性预览
背景色: #eefbf5
前景(文字)色: #000000
对比度: 19.75 : 1
标题示例
副文案可读性预览
背景色: #def7eb
前景(文字)色: #000000
对比度: 18.61 : 1
标题示例
副文案可读性预览
背景色: #c5f1dd
前景(文字)色: #000000
对比度: 17.00 : 1
标题示例
副文案可读性预览
背景色: #a4eac9
前景(文字)色: #000000
对比度: 15.19 : 1
标题示例
副文案可读性预览
背景色: #7be0b1
前景(文字)色: #000000
对比度: 13.14 : 1
标题示例
副文案可读性预览
背景色: #51d698
前景(文字)色: #000000
对比度: 11.42 : 1
每张卡都可直接复制「背景 / 前景」或一段 CSS。
固定使用纯黑 #000000 或纯白 #FFFFFF 中与背景对比更高的一种,适合快速定稿按钮与卡片。
推荐前景: #000000
对比度: 17.03 : 1
与「颜色对比度」工具使用相同 WCAG 2.1 公式;印刷与品牌色请以设计规范为准。