免费 · 无需注册 · 浏览器本地处理
HEX、RGB 与 HSL 颜色互转:保留透明度
输入颜色代码,或用取色器选择颜色,调整通道和透明度,实时预览并复制 HEX、RGB 或 HSL 格式的 CSS 色值。
颜色输入
本地处理示例:#ACCDEA · rgba(172, 205, 234, .5) · hsl(208, 60%, 80%)
RGB 通道
HSL 通道
HEX
#ACCDEARGB
rgb(172, 205, 234)HSL
hsl(208, 60%, 80%)使用步骤
输入 HEX、rgb(a) 或 hsl(a) 值,按需调整 RGBA 或 HSLA 通道,再复制所需格式。
使用前请检查
支持逗号分隔的 CSS RGB/HSL 和 3/4/6/8 位 HEX,并非所有 CSS Color 4 语法。
试一个例子
把 #ACCDEA 转为 RGB 与 HSL,再调低透明度制作半透明遮罩。
计算或处理方式
通过数学公式在 RGB 与 HSL 间转换;CSS 中的透明度显示到三位小数。
常见问题
在 HEX、RGB、HSL 之间转换颜色,保留透明度并即时预览。
如何使用HEX、RGB 与 HSL 颜色转换?
输入 HEX、rgb(a) 或 hsl(a) 值,按需调整 RGBA 或 HSLA 通道,再复制所需格式。
数据会上传吗?
工具在当前浏览器内处理输入与文件。页面访问统计不包含这些输入内容。
有哪些限制?
支持逗号分隔的 CSS RGB/HSL 和 3/4/6/8 位 HEX,并非所有 CSS Color 4 语法。