十六进制颜色难读因不直观表达色相、亮度或饱和度，需人脑反向解码；rgb()在微调明暗、动态控透明度、对接设计工具时更易维护，但需注意空格规范、数值范围及单位混用问题。
十六进制颜色为什么难读
因为 #3a86ff 这类值不直接表达色相、亮度或饱和度，人脑得反向解码——比如得意识到 #ff0000 是红，但 #e63946 就得停顿半秒才反应过来是偏粉的红。团队协作时，设计师给的「深蓝」在代码里变成 #1d3557，开发者很难确认是否准确还原。
rgb() 比 hex 更直观的三个场景
rgb() 不是万能替代，但在这些地方确实更易维护：
- 需要微调明暗：改
rgb(58, 134, 255)的第二个参数比算#3a86ff → #3a7bff直观得多 - 动态控制透明度：用
rgba(58, 134, 255, 0.8)比hsla()或转成 8 位 hex（#3a86ffcc）更直白 - 和设计系统对齐：Figma/Sketch 导出的颜色常带 r/g/b 数值，直接粘贴进 CSS 省去转换步骤
rgb() 使用时容易忽略的兼容性细节
现代浏览器全支持，但要注意：
- 空格和逗号必须规范：
rgb(58,134,255)合法，rgb(58, 134 ,255)也合法，但rgb(58,134, 255)中间多空格不影响；不过为防编辑器误判，统一用「逗号+空格」更稳妥 - 数值范围是 0–255，写成
rgb(256, 0, 0)会被静默截断为rgb(255, 0, 0)，不报错但颜色不对 - 不要混用单位：
rgb(50%, 0, 0)是合法语法（百分比模式），但它和rgb(128, 0, 0)不等价——前者按通道百分比计算，后者是绝对值，容易误以为等价
什么时候还是该用 hex
不是所有情况都适合换 rgb()：
立即学习“前端免费学习笔记（深入）”；
- 极简样式表（如内联 style 或原子 CSS 类）：
#000比rgb(0,0,0)少打 6 个字符 - 需要 CSS 变量批量控制色调时：
--primary: #3a86ff;比--primary-r: 58; --primary-g: 134; --primary-b: 255;更紧凑 - 工具链限制：某些老旧 CSS 压缩器（如旧版 cssnano）可能无法优化
rgb()冗余空格，导致体积略大
rgb() 也值得。 
