CSS 与前端开发工具

HEX to RGB

输入 HEX 颜色,立即查看 RGB、Red / Green / Blue 数值和规范化 HEX。

输入参数

浏览器本地处理

实时预览

参数修改后自动更新
可直接选择或复制

将 3 位或 6 位 HEX 转成 RGB,显示各通道数值与颜色预览。

输入内容仅在您的浏览器中处理,不会上传到服务器。

这个工具是什么

HEX to RGB 将十六进制颜色转换成 CSS rgb() 写法,帮助您在设计稿、样式表和开发参数之间使用同一种颜色。输入先经过严格验证,颜色预览只使用解析成功后的 RGB 数值。

如何使用

  1. 输入 #FF5733、#09f 或不带 # 的 3 位 / 6 位 HEX。
  2. 查看实时结果,也可以点击“转换”。
  3. 核对颜色预览与三个 RGB 通道,再点击“复制 RGB”。
  4. 使用“清空”移除输入,或点击“载入示例”恢复演示颜色。

使用示例

  • #FF5733 → rgb(255, 87, 51),规范 HEX 为 #ff5733。
  • #09f → rgb(0, 153, 255),规范 HEX 为 #0099ff。
  • #fff → rgb(255, 255, 255);#000000 → rgb(0, 0, 0)。

计算原理

6 位 HEX 每两位表示一个颜色通道,将其按十六进制转成 0~255 的整数。3 位 HEX 会先把每位重复一次,例如 #09f 展开为 #0099ff。本页仅接受不透明的 RGB HEX,不接受 4 位 / 8 位 alpha 格式。

常见用途

  • 把设计色值转换为 RGB 样式。
  • 核对简写 HEX 与完整 HEX 是否一致。
  • 查看单个红、绿、蓝通道的整数值。

隐私说明

所有输入、计算、CSS 生成和预览都在当前浏览器中完成,不会上传用户内容,不使用后台、数据库、在线 API 或第三方 CDN,也不会自动保存您的输入。

FAQ

HEX 是什么?

HEX 使用十六进制表示 RGB 三个通道,六位形式依次是红、绿、蓝,每个通道两位。

#fff 和 #ffffff 是否一样?

一样。三位简写中的每一位重复一次,所以 #fff 会正规化为 #ffffff。

为什么 #12345 或 #gg0000 报错?

本页只接受 3 位或 6 位十六进制字符,合法字符为 0~9、a~f,大小写均可。

HEX 转 RGB 会丢失精度吗?

不会。三位和六位不透明 HEX 都能精确转换为整数 RGB 通道。

返回开发者工具分类首页