十六进制到rgb转换器

欢迎使用 十六进制到rgb转换器，这是一个全面的颜色转换工具，可立即将十六进制颜色代码转换为 RGB、RGBA、HSL、HSLA 和 CMYK 值。无论您是网页设计师、开发人员还是数字艺术家，此工具都提供实时颜色预览、一键复制功能、互补色生成和 WCAG 无障碍对比度检查。

什么是十六进制颜色代码？

十六进制颜色代码（hexadecimal color）是一种用于在网页设计、CSS 和数字图形中表示颜色的 6 位代码。该代码由三对十六进制数字（0-9 和 A-F）组成，代表红、绿、蓝组件的强度。每对范围从 00（最小值，0）到 FF（最大值，255）。

例如，#FF5733 分解为：

• FF = 255 红色（最大红色强度）
• 57 = 87 绿色（中等绿色强度）
• 33 = 51 蓝色（低蓝色强度）

结果是鲜艳的珊瑚橙色。# 符号是可选的，但通常包含在内以将该值标识为十六进制颜色代码。

3 位简写

当所有三对颜色都使用重复数字时，您可以使用 3 位简写。例如，#FF5533 无法缩写，但 #FFAA00 可以写成 #FA0。每个数字会自动加倍：F 变为 FF，A 变为 AA，0 变为 00。

如何将十六进制转换为 RGB

将十六进制转换为 RGB 涉及将每对十六进制数字转换为其对应的十进制值：

1. 去掉 # 符号（如果存在）
2. 分成三对： 将 6 位数字分成 3 对（RR, GG, BB）
3. 转换每对： 从 16 进制（十六进制）转换为 10 进制（十进制）

十六进制到十进制转换

每个十六进制数字位都有一个值：第一位数字乘以 16，然后加上第二位数字。对于十六进制对 "5A"：

5 × 16 + 10 (A) = 80 + 10 = 90

了解颜色格式

RGB 和 RGBA

RGB (红, 绿, 蓝) 使用 0-255 的三个值定义颜色。RGBA 增加了一个 Alpha 通道 (0 到 1) 用于透明度。RGB(255, 87, 51) 是实心的，而 RGBA(255, 87, 51, 0.5) 是 50% 透明的。

HSL 和 HSLA

HSL (色相, 饱和度, 亮度) 对设计师来说通常更直观：

• 色相 (Hue)： 色轮位置 (0-360 度)。0=红，120=绿，240=蓝
• 饱和度 (Saturation)： 颜色强度 (0-100%)。0% 是灰色，100% 是鲜艳色
• 亮度 (Lightness)： 明亮度 (0-100%)。0% 是黑色，100% 是白色，50% 是纯色

CMYK

CMYK (青色, 品红色, 黄色, 黑色) 用于印刷生产。屏幕使用加色混合 (RGB)，而打印机使用减色混合 (CMYK)。颜色在打印时可能会有所不同，因此检查 CMYK 值有助于确保准确的印刷再现。

颜色理论：互补色和三色组合

互补色

互补色在色轮上彼此相对，产生最大的对比度。对于任何十六进制颜色，通过从 255 中减去每个 RGB 值来计算其互补色。互补色对用于：

• 突出的行动呼吁按钮
• 具有视觉冲击力的徽标设计
• 营造视觉紧张感和能量感

三色组合

三色组合是在色轮上等间距排列的三种颜色（相隔 120 度）。它们能创建鲜明且平衡的调色板，在保持和谐的同时提供多样性。这种方案在平面设计和品牌建设中非常流行。

WCAG 无障碍和对比度

网页内容无障碍指南 (WCAG) 定义了可读文本的对比度：

• AAA 级 (7:1)： 极好 - 最高无障碍标准
• AA 级 (4.5:1)： 良好 - 普通文本的最低标准
• AA 级大字 (3:1)： 适用于大文本（18pt+ 或 14pt 粗体）
• 不合格 (<3:1)： 对无障碍访问而言对比度不足

我们的工具计算针对白色和黑色背景的对比度，帮助您为设计选择符合无障碍要求的文本颜色。

如何使用此计算器

1. 输入您的十六进制代码： 输入或粘贴十六进制颜色（带或不带 #）。支持 6 位和 3 位格式。
2. 设置 alpha（可选）： 调整透明度（从 0 不可见到 1 实心），用于 RGBA/HSLA 输出。
3. 点击转换： 立即查看 RGB, HSL, CMYK 值和颜色预览。
4. 复制任何格式： 点击复制按钮将值复制到剪贴板。
5. 探索调色板： 查看互补色、三色方案、阴影和色调以获取设计灵感。

常见问题

什么是十六进制颜色代码？

十六进制颜色代码是在网页设计和数字图形中使用的颜色 6 位（或 3 位简写）十六进制表示形式。它以 # 符号开头，后跟代表红、绿、蓝组件的六个字符（0-9 和 A-F）。例如，#FF5733 代表珊瑚橙色，其中红=255，绿=87，蓝=51。

如何将十六进制转换为 RGB？

手动将十六进制转换为 RGB：1) 去掉 # 符号，2) 将 6 位数字分成 3 对（RR, GG, BB），3) 将每对从十六进制转换为十进制。例如，#FF5733：FF=255（红），57=87（绿），33=51（蓝），得到 RGB(255, 87, 51)。我们的转换器可以立即完成此操作。

RGB 和 RGBA 有什么区别？

RGB 使用红、绿、蓝数值（每个 0-255）指定颜色。RGBA 增加了一个 Alpha 通道（0-1）用于透明度。RGB(255, 87, 51) 是实心色，而 RGBA(255, 87, 51, 0.5) 是 50% 透明度的相同颜色。RGBA 对于创建半透明叠加层和效果至关重要。

什么是 HSL 颜色格式？

HSL 代表色相（Hue）、饱和度（Saturation）和亮度（Lightness）。色相是颜色角度（0-360 度），饱和度是颜色强度（0-100%），亮度是明亮度（0-100%）。HSL 对设计师来说通常更直观，因为调整亮度或饱和度很简单，不会影响基本色相。

什么是 CMYK，我该什么时候使用它？

CMYK 代表青色（Cyan）、品红色（Magenta）、黄色（Yellow）和黑色（Key/Black）。它是印刷生产中使用的颜色模型。虽然十六进制和 RGB 用于屏幕（加色模型），但 CMYK 用于印刷（减色模型）。如果您的设计将用于印刷，您应该检查 CMYK 值以确保颜色准确。

什么是互补色？

互补色是在色轮上直接相对的颜色，产生最大的对比度。对于任何颜色，其互补色是通过反转 RGB 值（255 减去每个通道的值）找到的。互补色可创建鲜明、高对比度的设计，常用于徽标和行动呼吁（CTA）元素。

相关资源

• 网络颜色 - 维基百科
• RGB 颜色模型 - 维基百科
• WCAG 对比度指南 - W3C