Elysia Tools
导航
Design
· 最后更新：2025-01-11
将RGB颜色值转换为HSL用于屏幕显示
执行
填写表单、运行工具，并在同一页面查看结果。
案例
相关内容
工具使用指南
RGB转HSL转换器是一款高效的在线颜色格式转换工具，旨在帮助设计师和开发者将RGB或十六进制颜色值快速转换为HSL（色相、饱和度、亮度）格式，从而更直观地调整网页和UI设计的色彩方案。
背景
正在编写一个按钮的悬停效果，需要将基础色 #FF0080 转换为 HSL 以便通过调整亮度实现变色。
问题
需要快速获取 #FF0080 对应的 HSL 值，并确保格式符合 CSS 规范。
如何使用
在输入框输入 #FF0080，选择输出格式为“hsl(0, 100%, 50%) / hsla(0, 100%, 50%, 0.5)”。
format: css结果
得到 hsl(330, 100%, 50%)，可以直接在 CSS 中使用 hsl(330, 100%, 40%) 实现悬停变暗效果。
背景
需要将一套包含 10 个 RGB 值的配色表转换为 HSL，以便在代码库中进行管理。
问题
手动计算转换效率低下且容易出错。
如何使用
将 10 个 RGB 值逐行粘贴到输入框，选择“labeled”格式以便于阅读。
format: labeled结果
一次性获得所有颜色的 H、S、L 数值标签，方便整理进设计系统文档。
HSL代表色相（Hue）、饱和度（Saturation）和亮度（Lightness），它比RGB更符合人类描述颜色的方式。
支持RGB、RGBA、十六进制（#FF0080）、简写十六进制以及带透明度的十六进制格式。
可以，选择“css”格式选项即可直接生成符合CSS语法标准的 hsl() 或 hsla() 代码。
可以，只需在输入框中每行输入一个颜色值，工具将批量处理并输出结果。
不会，如果输入包含Alpha通道（如RGBA），转换器会自动将其转换为HSLA格式。