「颜色转换 / 对比度」主要解决什么问题?
HEX、RGB、HSL 互转,检查两种颜色的 WCAG 对比度和可读性。 适合先完成计算、转换或检查,再根据实际使用场景复核输出。
工具
HEX、RGB、HSL 互转,并检查文字和背景的 WCAG 对比度。
预览
海豹工具箱
The quick brown fox jumps over the lazy dog.
#111111
rgb(17, 17, 17)
hsl(0 0% 7%)
#ffffff
rgb(255, 255, 255)
hsl(0 0% 100%)
18.88:1
USE & REVIEW
HEX、RGB、HSL 互转,检查两种颜色的 WCAG 对比度和可读性。 适合先完成计算、转换或检查,再根据实际使用场景复核输出。
先确定目标容器尺寸、品牌色、字体和交互状态。只看单一桌面尺寸容易遗漏移动端、键盘操作、对比度和长文本问题。
颜色转换 / 对比度不会把输入内容自动发布成公开页面。标明“本地处理”的步骤只在浏览器内运行;涉及实时数据、IP、外部网址或在线查询时可能需要联网,因此不要输入与任务无关的敏感资料。
在目标屏幕尺寸和浏览器中预览,并检查对比度、可读性和响应式变化。复制出的样式适合作为起点,仍要结合现有设计系统调整。
它适合快速试验和生成基础样式,不会自动符合你的完整设计系统、品牌规范或所有无障碍要求。