FREE TOOL
颜色值转换
HEX、RGB、HSL颜色格式实时互转，带颜色预览和取色器，设计师和前端开发常用工具，纯本地运行。
HEX、RGB、HSL颜色格式实时互转，带颜色预览和取色器，设计师和前端开发常用工具，纯本地运行。
颜色值在Web开发中有多种表示方式：HEX十六进制、RGB、HSL、RGBA等。不同场景需要不同的格式：CSS中常用HEX和RGB，设计稿中常用HEX，需要透明度时用RGBA，需要调整亮度饱和度时用HSL最方便。颜色值转换工具可以在各种格式之间快速转换。
前端开发中，设计稿给的是HEX值，需要转成RGB或HSL来做渐变或透明度。CSS动画中需要用HSL调整色相、饱和度、亮度。UI设计中需要对比不同格式的颜色表示。从图片中取色后转换为需要的格式。
在任意一个输入框中输入颜色值（如#ff0000或rgb(255,0,0)），其他格式会自动转换并显示。点击颜色预览区域可以打开颜色选择器，可视化选择颜色。透明度滑块可以调整Alpha值，生成带透明度的RGBA或HSLA格式。每个格式旁边都有复制按钮，一键复制到剪贴板。
HEX十六进制写法最简洁，适合CSS和设计稿标注；RGB方便调整亮度和通道值，适合程序动态计算颜色。两者可以无损互转。
HSL用色相、饱和度、亮度三个维度描述颜色，调整亮度和饱和度更直观，做主题切换和深浅色模式时用HSL计算更方便。
HEX加两位后缀如FF表示不透明，00表示全透明；RGBA和HSLA在括号内加第四个参数，取值0到1之间的小数。
CSS定义了140多个颜色名称如red、blue、teal等，但实际开发中更推荐用HEX或RGB，精确可控且兼容性更好。