将 RGB 颜色转换为 HEX(及反向)
在 rgb() 与 #rrggbb 表示间转换颜色值,并为 CSS 工作处理 alpha 通道。
- 1 颜色转换器 →
粘贴 rgb(90, 200, 250) 得到 #5AC8FA,或粘贴 hex 值得到其 rgb() 形式。带 alpha 的 8 位 hex(#5AC8FAFF)转换为 rgba() 表示。
- 2
值得了解的细节:HEX 与 rgb() 是同一色彩空间(sRGB)的不同语法——转换无损;3 位 hex(#F0A)是 #FF00AA 的简写;CSS 颜色可用——命名颜色和 hsl() 输入也会被转换。当精度重要时(设计令牌),优先用 6 位 hex 或 rgb() 而非 3 位简写。
- 3 颜色对比度检查器 →
转换后,将颜色与你的背景对照检查:WCAG 对比度决定文本是否通过无障碍阈值(正文 4.5:1,大号文本 3:1)。
常见问题
- HEX 比 RGB 更精确吗?
- 不——二者表达相同的 sRGB 值。#5AC8FA 和 rgb(90, 200, 250) 是同一颜色;选你的工具所期望的。
- alpha 如何处理?
- 8 位 HEX 将 alpha 编码为末字节(#RRGGBBAA),rgba() 取 0–1 的 alpha。FF / 1.0 表示完全不透明。