RGB 转 HSL 怎么算 - 色相/饱和度/亮度换算方法

🌟 为什么要转成 HSL#

RGB 描述”红绿蓝各多少”，不直观；HSL 描述”色相/饱和度/亮度”，更贴近人的调色直觉。把 RGB 转成 HSL，就能用”改亮度、改饱和度”的方式调色。星点颜色格式转换支持互转。

🧮 换算公式#

设 RGB 归一化到 0~1：R、G、B。

1. max = max(R,G,B)，min = min(R,G,B)
2. 亮度 L = (max + min) / 2
3. 饱和度 S：
   • 若 max = min（灰色）：S = 0
   • 否则 S = (max − min) / (1 − |2L − 1|)
4. 色相 H：
   • 若 max = R：H = 60 × ((G − B) / (max − min))
   • 若 max = G：H = 60 × (2 + (B − R) / (max − min))
   • 若 max = B：H = 60 × (4 + (R − G) / (max − min))
   • 若 H < 0，加 360

📐 完整示例：rgb(64, 158, 255)#

1. 归一化：R=0.251，G=0.620，B=1.000
2. max=1.000，min=0.251
3. L = (1.000 + 0.251)/2 = 0.625 → 62.5%
4. delta = 0.749；S = 0.749 / (1 − |2×0.625 − 1|) = 0.749 / 0.749 = 1.0 → 100%
5. max 是 B：H = 60 × (4 + (0.251 − 0.620)/0.749) ≈ 60 × 3.508 ≈ 210°

结果：hsl(210, 100%, 63%)。

📋 常见颜色对照#

💡 用 HSL 调色#

这就是颜色调整的原理。

⚠️ 注意#

• 灰色（R=G=B）没有色相，H 定义为 0；
• H 是角度，转换存在四舍五入误差；
• 感知亮度与 HSL 亮度不完全一致，专业调色可用 OKLCH。

🔧 常见问题#

💬 总结#

RGB 转 HSL 就是”先求 max/min，再算 L、S、H”。理解后调色更直观。懒得算就用颜色格式转换输入即得。

立即体验：访问 颜色格式转换