backdrop-filter中saturate()必须与blur()合并声明，如backdrop-filter: blur(10px) saturate(180%)，否则Safari会忽略；饱和度宜设160%–190%，过高易溢色，过低则灰蒙；HSLA仅影响自身背景混合效果，非滤镜本身；深色模式需调基底色而非仅调saturate。
backdrop-filter里saturate()必须和blur()写在同一声明中
单独写backdrop-filter: blur(10px)，背景会发灰、失色，这不是 bug，是高斯模糊算法天然降低饱和度和对比度。必须用saturate()补偿，且 Safari 只认合并写法：backdrop-filter: blur(10px) saturate(180%)。拆成两行（比如先写 blur，再覆盖写 saturate）会被 Safari 忽略后一条。
饱和度值不是越高越好：160%–190%是实测安全区间
saturate(160%)到saturate(190%)之间能有效还原色彩活力，低于 160% 补不回灰蒙感，高于 200% 在部分 Android WebView（尤其深蓝/紫渐变背景）会出现溢色——边缘泛白、色块突兀。不要凭感觉调到 250%，那不是更“玻璃”，是更“失真”。
HSL本身不参与磨砂渲染，但HSLA背景色影响最终色调感知
很多人误以为要用hsl()或hsla()定义玻璃层颜色来“控制饱和度”，其实不然：backdrop-filter作用的是背后内容，不是本元素的 background。但玻璃层自身的background-color（比如hsla(210, 30%, 60%, 0.2)）会和模糊后的背景混合，从而影响整体冷暖倾向和明暗层次。建议优先用rgba()确保兼容性；若坚持用 HSLA，避免饱和度过高（>40%）或明度极端（90%），否则在旧版 WebView 中易突然全黑或全透。
深色模式下别硬套浅色饱和度参数
浅色模式常用rgba(255, 255, 255, 0.12) + saturate(180%)，但深色模式下直接复用会吞掉背景细节，显得平、闷。此时重点不是调saturate()，而是换基底色：用低饱和、带灰阶的深色，比如rgba(30, 30, 46, 0.4)（偏蓝灰）或rgba(28, 28, 38, 0.35)（更中性），再配稍高透明度（0.3–0.45）。这样即使saturate()维持 170%，也能保留背景层次。
立即学习“前端免费学习笔记（深入）”；
真正容易被忽略的点是：saturate 补偿只对“背后有内容可模”的区域生效。如果父容器是空的、overflow: hidden 截断了背景、或者 background 是纯色没纹理，那再高的饱和度也补不出颜色——你是在给空气加饱和度。
