颜色转换器

将十六进制颜色转换为 RGB、HSL 和 CSS 变量格式。

处理方式

输入六位十六进制颜色,可带或不带 #。输出适用于常见 CSS 用法。

十六进制通道 → RGB;RGB → HSL。

调试场景

转换三位或六位十六进制设计令牌,把 RGB 和 HSL 结果放入测试样式表,并在目标浏览器比较渲染颜色。等价颜色表示不能说明可访问性,因此还要单独检查对比度和交互状态。

如何解读结果

输出表示不透明的 sRGB 风格颜色。HSL 为便于 CSS 阅读会进行舍入,往返后的显示数字可能略有变化,但渲染等价。本转换不处理透明度、广色域配置、色彩管理和背景对比度。

输入字段参考

十六进制颜色
示例默认值: 已提供示例输入

常见错误

  • 把密钥、凭据、客户记录或其他生产数据粘贴到浏览器工具或可分享 URL。
  • 把转换结果当作颜色对比度、显示一致性或广色域等价的证明。
  • 把便捷预览当成目标运行时、解析器、数据库或安全控制的验证结果。

使用结果前的检查清单

  1. 把输入缩减为仍可复现问题的模拟示例。
  2. 在目标浏览器渲染,并对每组前景、背景和状态执行对比度检查。
  3. 发布前把确认后的输入和预期输出加入项目回归测试。

用于生产前需要确认的问题

支持三位简写吗?

支持。三位颜色会先展开再转换。

会改变颜色配置吗?

工具转换 sRGB 风格数值,不管理显示器颜色配置。

独立开发者工具,生产使用前请检查输出。

相关深度开发指南

时间、URL 与 Web 互操作:测试边界而非表象

Web 值常常看起来可读,却携带隐藏的单位、上下文或兼容性假设。本指南让每个值通过真正消费它的系统进行验证。

阅读指南