DataHub Tools 颜色格式转换

HEX RGB HSL 颜色转换工具

本地优先

转换 HEX、RGB 和 HSL 颜色，并生成本地颜色报告。

工具实际如何工作？

转换器接受 3/4/6/8 位 HEX、旧式或现代 RGB、百分比通道以及带可选 alpha 的 HSL/HSLA，并输出规范化 HEX、RGB、HSL 和 alpha。

  • 读取 HEX、RGB 和 HSL
  • 支持现代空格/斜杠语法与 alpha
  • 校验通道和百分比范围

如何使用？

  1. 输入支持的 HEX、RGB(A) 或 HSL(A)。
  2. 转换并检查规范化通道和 alpha。
  3. 把结果作为 sRGB 表示使用。
  4. 涉及色域或颜色空间时再用浏览器渲染复核。

快速示例

示例输入

#0f766e

预期结果

HEX: #0f766e
RGB: rgb(15, 118, 110)
HSL: hsl(175, 77%, 26%)

工具处理 sRGB 风格 HEX/RGB/HSL，不转换 color()、lab()、lch()、oklab() 或 oklch() 等广色域颜色空间。

适合哪些场景？

  • 转换不透明旧式颜色值。
  • 比较基础 HEX 和 RGB 写法。
  • 为设计检查获取舍入后的 HSL 近似值。

参考标准与适用边界

CSS Color 4 还定义了超出本页 sRGB HEX/RGB/HSL 子集的其他颜色空间。

来源核验日期：2026 年 7 月 24 日。规范与平台行为可能更新，正式使用前请复核来源。

已知限制

  • RGB 通道、百分比和 alpha 会进行范围校验。
  • alpha 小于 1 时会单独报告并编码进 HEX。
  • HSL 输出经过舍入，往返转换不一定逐字节相同。

FAQ

可以输入 HSL 吗？

可以，支持饱和度和亮度为百分比的 HSL/HSLA。

alpha 会保留吗？

会。RGBA、HSLA 和 4/8 位 HEX 的 alpha 会报告并编码进输出 HEX。

支持 rgb(15 118 110 / 50%) 吗？

支持，也支持百分比通道。

会校验通道范围吗？

会。RGB、百分比、HSL 或 alpha 越界会报错。

相关工具

JSON 格式化 在线格式化、压缩和检查 JSON。 JSON JSON 校验 在线校验 JSON 语法并定位错误。 JSON JWT 解码 本地解码 JWT Header 和 Payload。 JWT Cron 表达式生成 生成常见 Cron 表达式，并解释已有计划。 Cron URL 编码解码 在浏览器本地编码或解码 URL 参数、查询字符串和特殊字符。 URL查询字符串 Base64 编码解码 本地将文本编码为 Base64，或将 Base64 解码为可读文本。 Base64UTF-8 文本 Unix 时间戳转换 将 Unix 时间戳转换为可读时间，也可以从日期生成时间戳。 Unix 时间戳日期 UUID 生成器 在浏览器本地生成随机 UUID v4，用于测试、记录和唯一标识。 UUID v4 文本差异对比 逐行对比两段文本，标记新增、删除和变化内容。