什么是RGB / HEX / HSL 颜色转换？
RGB、HEX 与 HSL 颜色转换用于在常见 CSS 颜色表示之间快速换算，并以色块预览标准化结果。页面接受三位或六位 HEX、rgb() 与 hsl() 文本，输出大写六位 HEX、整数 RGB 和舍入后的 HSL，适合整理设计标注、主题变量和样式代码。常见使用场景包括：把设计稿中的 HEX 颜色换算成 CSS RGB 或 HSL。；统一主题令牌和组件样式中的颜色表示。；检查某个 HSL 调整后对应的实际色块与通道数值。页面同时列出输入边界、输出规则和限制，便于在复制结果或投入实际流程前核对格式、语义与安全注意事项。
适用场景
- 把设计稿中的 HEX 颜色换算成 CSS RGB 或 HSL。
- 统一主题令牌和组件样式中的颜色表示。
- 检查某个 HSL 调整后对应的实际色块与通道数值。
使用方法
- 输入 HEX、RGB 或 HSL 颜色。
- 执行解析和转换。
- 检查色块与三个标准化结果。
- 先使用页面提供的复杂示例验证当前选项和运行方向，再替换为自己的数据。
- 检查输出区、状态提示和限制说明，确认结果符合预期后再复制、下载或继续处理。
可运行示例
工作区中的“示例 1”和“示例 2”按钮会载入对应内容。两个示例覆盖不同结构、方向或边界，可以直接运行并观察输出与状态提示。
示例 1
#087f74示例 2
hsl(224, 51%, 41%)输入规则
- 支持 #RGB、#RRGGBB、rgb(r,g,b) 和 hsl(h,s%,l%)。
- 当前版本不接受命名颜色，也不保留 rgba 或 hsla 的透明度。
- RGB、饱和度和亮度会限制到有效范围，色相按 360 度循环。
- 文本输入在运行前按字符计数，当前页面上限为 200；文件类功能另按页面显示的文件上限执行。
- 不保留 alpha 通道。
输出规则
- HEX 统一扩展为六位大写表示。
- RGB 输出 0～255 的整数通道，HSL 输出舍入后的整数。
- 舍入后的 HSL 再换算时可能与原始小数值存在极小差异。
- 输出只反映当前输入、方向和选项；切换模式或修改输入后应重新运行，不应把旧结果当成新结果。
- HSL 输出采用整数舍入。
限制与注意事项
- 不保留 alpha 通道。
- HSL 输出采用整数舍入。
- 不是完整色彩管理或广色域转换工具。
数据处理说明
颜色解析、数学换算和色块预览均在浏览器内完成，不读取屏幕像素、不上传颜色，也不调用第三方设计服务。关闭或刷新页面后，本工具不会保留本次数据。