用途:为无障碍设计生成颜色阶梯,帮助创建符合 WCAG 对比度的文本与背景组合。
主要能力:生成 11 级色阶(索引 0-10),使用对称配对逻辑(如 0+10、1+9、2+8)。资料给出配对对比度参考:最大对比为 0+10;AAA 常规文本约为 1+9、2+8(7:1 以上);AA 常规文本约为 3+7(4.5:1 以上);AA 大号文本约为 4+6(3:1 以上)。
使用方式:安装命令为 npx @basiclines/rampa。生成配方示例:rampa -C "<brand-color>" -L 98:5 --size=11 -O css --name=color。其中 -L 98:5 确保从近白到近黑的范围,--size=11 生成索引 0-10。示例输出为 CSS 变量 --blue-0 至 --blue-10。
适用场景:创建无障碍颜色组合、需要 WCAG 合规颜色、生成高对比度配对、确保文本可读;也可为多个品牌色生成阶梯,使用相同索引配对逻辑。
限制:资料未提供具体支持的平台、收费方式或性能数据;建议始终测试实际渲染对比度,可用 Stark、axe 等工具验证。中间值(4、5、6)可用于禁用或弱化状态;按钮可用索引 5-6 作为背景、0-1 作为文字。