RGB颜色转换器 | HEX转RGB | 颜色代码转换工具
在HEX、RGB、RGBA、HSL等颜色格式之间进行转换的在线工具,支持颜色代码查询和颜色选择器
免费在线RGB颜色转换工具,支持HEX、RGB、RGBA、HSL、HSLA等多种颜色格式互转,颜色代码查询,颜色选择器,适用于网页设计、UI开发和图形编辑场景
使用说明
什么是颜色格式转换?
颜色格式转换用于在 HEX、RGB、RGBA、HSL、HSLA 等不同表示方式之间互转,方便你在 CSS、设计稿与代码之间统一使用同一种颜色。
颜色选择
左侧使用 HSV 调色板、预设色与明暗变体选色;中间可预览当前颜色、粘贴任意 CSS 颜色字符串识别,并在各格式文本框中粘贴或编辑后按 Enter,实现与其它格式的自动互转;右侧查看 RGB/HSL 分量条。
支持的输入格式
- HEX:如 #3498db 或 #3ad(自动展开为 #33aadd)
- RGB/RGBA:如 rgb(52, 152, 219)、rgba(52, 152, 219, 0.5)
- HSL/HSLA:如 hsl(204, 70%, 53%)、hsla(204, 70%, 53%, 0.5)
- CSS 命名颜色:如 red、cornflowerblue 等浏览器支持的关键字
颜色变体
颜色预览区下方会基于 HSL 亮度自动生成 5 档变体:亮 50%、亮 25%、原色、暗 25%、暗 50%,点击任意变体即可作为新原色继续调整。
CSS 代码生成
在 CSS 代码区域提供「现代语法」「兼容写法」「渐变」三种模板,可直接复制到样式表中使用,便于网页与组件配色。
使用小贴士
- RGB / HSL 输入框支持鼠标滚轮调整,按住 Shift 可微调
- 短 HEX 仅在三组分量可压缩时显示(如 #ffcc00 → #fc0)
- 颜色名称会根据 HSL 距离自动匹配最接近的常用颜色
- 拖动颜色组件条可以快速调整对应的 R/G/B/H/S/L 分量