RGB 转 HEX 转换器

RGB 转 HEX 转换器可将 rgb(59, 130, 246) 这样的 RGB 值转换为 #3B82F6 这样的十六进制代码。RGB 是屏幕描述颜色的方式，也是多数设计工具的输出格式，而 HEX 则是 CSS 和 HTML 最常用、便于复制的紧凑格式。

HEX 就是十六进制的 RGB。每个通道（0–255）变成一对两位字符（00–FF），因此 59 变成 3B，246 变成 F6。

何时需要它

编写 CSS

把工具输出的 RGB 转换为整洁的 HEX 代码，直接写入样式表或主题变量。

分享颜色

单个 HEX 字符串远比三个独立数字更容易复制、发送和记录。

设计交付

把选定的 RGB 值转换为 HEX，用于品牌规范、设计令牌和开发文档。

如何将 RGB 转换为 HEX

1

输入 RGB 值

键入三个通道 — 例如 59, 130, 246。可用逗号或空格分隔，也可按需用 rgb(...) 包裹。

2

读取 HEX 结果

HEX 代码会在你输入时即时生成，实时色块同步更新，方便你一眼确认颜色。

3

或直接选色

点击色块即可打开系统原生取色器直观选色 — RGB 和 HEX 字段会自动填入。

4

复制与复用

点击复制按钮即可获取 HEX 代码。下方面板还会以 RGB、HSL、HSV 和 CMYK 显示同一颜色。

功能特性

实时输出

输入时 HEX 即时更新，全部在浏览器中完成 — 无需等待，无需刷新。

灵活输入

接受以逗号或空格分隔的数值，带不带 rgb() 包裹都行。

预览与取色

实时色块可验证结果，取色器支持直观选色。

所有格式一次呈现

为你输入的每种颜色同时显示 HEX、RGB、HSL、HSV 和 CMYK。

标准输出：HEX 代码以大写形式返回（如 #3B82F6），这是惯例 — 不过在 CSS 中 HEX 不区分大小写。

常见问题

哪些 RGB 值是有效的？

每个通道必须是 0 到 255 之间的整数。超出该范围的值会被钳制或标记，因为 RGB 在此范围之外没有意义。

为什么用 HEX 而不用 RGB？

HEX 更紧凑，作为单个字符串更易复制和分享。两种格式在 CSS 中都获完整支持，所以选择主要取决于便利性和团队约定。

如何输入 RGB 值？

用逗号或空格分隔三个数字输入 — 例如 59, 130, 246 或 59 130 246。用 rgb(...) 包裹也可以。

输出是大写还是小写？

转换器输出大写 HEX（如 #3B82F6），这是最常见的约定。CSS 对 #3b82f6 和 #3B82F6 一视同仁。

转换精确吗？

精确。RGB 转 HEX 是一一对应、无损的映射 — 每个 0–255 通道恰好变成一对 00–FF，因此相同的 RGB 输入总会得到相同的 HEX，没有任何舍入。