← 返回工具箱

工具

颜色转换 / 对比度

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

通过普通文本 AA
通过大文本 AA
通过普通文本 AAA

常用组合

USE & REVIEW

颜色转换 / 对比度常见问题

查看全部工具指南 →

「颜色转换 / 对比度」主要解决什么问题?

HEX、RGB、HSL 互转,检查两种颜色的 WCAG 对比度和可读性。 适合先完成计算、转换或检查,再根据实际使用场景复核输出。

使用「颜色转换 / 对比度」前,输入内容要怎样准备?

先确定目标容器尺寸、品牌色、字体和交互状态。只看单一桌面尺寸容易遗漏移动端、键盘操作、对比度和长文本问题。

使用「颜色转换 / 对比度」时,数据会被保存或上传吗?

颜色转换 / 对比度不会把输入内容自动发布成公开页面。标明“本地处理”的步骤只在浏览器内运行;涉及实时数据、IP、外部网址或在线查询时可能需要联网,因此不要输入与任务无关的敏感资料。

「颜色转换 / 对比度」的结果应该怎样核对?

在目标屏幕尺寸和浏览器中预览,并检查对比度、可读性和响应式变化。复制出的样式适合作为起点,仍要结合现有设计系统调整。

什么情况下不应该只依赖「颜色转换 / 对比度」?

它适合快速试验和生成基础样式,不会自动符合你的完整设计系统、品牌规范或所有无障碍要求。