核心答案：#FF5733 = RGB(255, 87, 51)：FF→255、57→87、33→51（两位一组十六进制转十进制）。反转换：255→FF（255÷16 = 15 余 15）。
HEX 与 RGB 互转
HEX → RGB：#RRGGBB 两两分组转十进制
- #FF5733：FF=255、57=87（5×16+7）、33=51（3×16+3）
- 速算：A=10、B=11、C=12、D=13、E=14、F=15
RGB → HEX：每通道 ÷16 得高位和余数
- 87 → 87÷16 = 5 余 7 → 57
- 拼接：rgb(255,87,51) → #FF5733
RGB 与 HSL 互转
HSL 三要素：
- H 色相：0° 红、120° 绿、240° 蓝，色环位置
- S 饱和度：0% 灰、100% 纯色
- L 亮度：0% 黑、50% 本色、100% 白
例：纯红 hsl(0, 100%, 50%) = #FF0000；L 提到 75% 变粉红。
常用颜色速查表
| 颜色 | HEX | RGB |
|---|---|---|
| 纯红 | #FF0000 | 255,0,0 |
| 纯绿 | #00FF00 | 0,255,0 |
| 纯蓝 | #0000FF | 0,0,255 |
| 白 | #FFFFFF | 255,255,255 |
| 黑 | #000000 | 0,0,0 |
| 翠绿 | #10B981 | 16,185,129 |
调色实战技巧
- 调明暗用 HSL：固定 H/S 只改 L——比 RGB 三个一起调自然
- 同色系：固定 H，改 S/L 得配色方案（主色 L50%、浅底 L95%、文字 L20%）
- 互补色：H ± 180°；邻近色：H ± 30°
- 取中间色：RGB 各通道取平均可混色
常见误区
- 「#FFF 和 #FFFFFF 不同」：三位 HEX 是缩写，每位重复：#FFF = #FFFFFF，#F53 = #FF5533。
- 「RGB 255 是百分比」：RGB 通道 0–255（8 位），不是 0–100。CSS 里 rgb(100%, 0%, 0%) 也合法但别混写。
- 「屏幕色 = 印刷色」：屏幕 RGB 加色、印刷 CMYK 减色。屏幕鲜艳的蓝绿色印刷常偏暗，重要物料要出 CMYK 打样。