hsltorgb转换需先校准参数：色相h保持0–360整数，饱和度s和亮度l须用parsefloat提取后除以100转为0–1小数，并处理max===min时h=0、s=0的边界情况。
直接用 hslToRgb 函数就行，但必须注意 HSL 输入值的单位和范围 —— 浏览器 CSS 里的 hsl(120, 50%, 70%) 和 JS 里做计算时用的数值不是一回事，不校准会得到完全错误的 RGB。
hsl() 函数参数怎么传给转换函数？
CSS 的 hsl() 语法中：色相 h 是 0–360 的整数（度），饱和度 s 和亮度 l 是带 % 的字符串，比如 "50%"。JS 数学计算不能直接用字符串或带单位的值。
- 先用正则或
parseFloat提取数字，再把s和l除以 100 转成 0–1 区间的小数 -
h保持 0–360，但内部计算时建议先归一化为 0–1（除以 360），避免角度运算出错 - 别漏掉边界处理：当
max === min（即灰阶）时，h应设为 0，s设为 0，否则h会 NaN
rgbToHsl 和 hslToRgb 不是对称逆运算？
它们数学上可逆，但浮点精度和四舍五入会让结果“看起来不一致”。比如 hslToRgb(240, 100%, 50%) 得到 [0, 0, 255]，再套 rgbToHsl(0, 0, 255) 可能返回 [240, 100, 50]，也可能因小数截断变成 [240, 99, 50]。
- 关键在中间步骤是否用
Math.round()或toFixed(0)：RGB 分量必须是 0–255 整数，H/S/L 通常保留整数度/百分比 - 不要在链式调用中反复转来转去，尤其做主题色生成时，应固定以 HSL 为源头，只转一次到 RGB
- 浏览器原生
getComputedStyle(el).color返回的是 RGB 字符串，不是 HSL —— 想反向提取 HSL 必须先 parse RGB 再算
为什么 hsl(0, 0%, 50%) 转出来不是 rgb(128, 128, 128)？
因为 HSL 的 L = 50% 并不等于 RGB 的“平均亮度”，而是按公式 L = (max(R,G,B) + min(R,G,B)) / 2 定义的。对灰阶来说它成立，但这个公式是非线性的，且未考虑 gamma 校正。
-
hsl(0, 0%, 50%)→ 灰色，但具体 RGB 值取决于实现：标准算法给出的是[128, 128, 128]，没错 - 如果得到
[127, 127, 127]或[129, 129, 129]，大概率是某步用了Math.floor或没处理 0.5 四舍五入 - 真正容易被忽略的是：HSL 的
L=0%一定是黑，L=100%一定是白，但L=50%在不同色相下视觉明暗感差异很大（比如黄 vs 蓝），这不是 bug，是模型特性
写转换逻辑时，别依赖“肉眼看着对”，得拿已知标准值验证：比如 hsl(0, 100%, 50%) 必须出 [255, 0, 0]，hsl(120, 100%, 50%) 必须出 [0, 255, 0]。差一个数，说明某个除法或条件分支没对齐。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
