十六进制颜色代码#A8C2E1对应RGB(168, 194, 225),转换时先拆分为A8、C2、E1三组,再将每组十六进制数转为十进制:A8=168,C2=194,E1=225。

十六进制颜色代码(如 #FF5733)本质是RGB三通道的紧凑表示,每两位对应一个十进制数值:红(R)、绿(G)、蓝(B),范围都是 0–255。转换核心就是把每组两位十六进制数单独转为十进制。
拆分三组,逐段转换
以 #A8C2E1 为例:
- 去掉开头 #,得到 A8 C2 E1(空格仅为视觉分隔)
- 红(A8)→ A=10,8=8 → 10×16 + 8 = 168
- 绿(C2)→ C=12,2=2 → 12×16 + 2 = 194
- 蓝(E1)→ E=14,1=1 → 14×16 + 1 = 225
结果:RGB(168, 194, 225)
记住常用十六进制数字对应值
快速心算离不开基础映射:
- 0–9 对应 0–9
- A=10,B=11,C=12,D=13,E=14,F=15
- 特别注意:FF = 15×16 + 15 = 255,00 = 0,80 = 128,40 = 64
带简写格式(3位)的处理
像 #3A9 这类缩写,需先展开为6位再转:
- #3A9 → 每位重复一次 → #33AA99
- 红:33 → 3×16 + 3 = 51
- 绿:AA → 10×16 + 10 = 170
- 蓝:99 → 9×16 + 9 = 153
结果:RGB(51, 170, 153)
用浏览器控制台快速验证
不需要工具也能即时检验:
- 打开浏览器开发者工具(F12),切换到 Console 标签
- 输入:new DOMParser().parseFromString('', 'text/html').querySelector('div').style.color
- 回车后会返回 rgb(255, 107, 53) —— 浏览器自动帮你转好了










