用 rgba 替代纯色可使阴影更柔和，如 box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15)；需根据背景色调整基色与透明度，并配合模糊半径、偏移及多层叠加优化层次感。
阴影颜色太生硬，通常是因为用了纯色（比如 box-shadow: 0 4px 12px #000）导致边缘锐利、对比过强。解决方法很简单：把阴影颜色从十六进制（#000）或命名色（black）换成 rgba，通过控制透明度（alpha 值）让阴影自然过渡、视觉更柔和。
纯黑阴影（rgba(0, 0, 0, 1)）吸睛又压迫；把 alpha 值调低到 0.1–0.3，效果立刻不同：
)；需根据背景色调整基色与透明度，并配合模糊半径、偏移及多层叠加优化层次感。box-shadow: 0 4px 12px rgba(0, 0, 0, 0.15); —— 常用舒适值，适合卡片、按钮box-shadow: 0 2px 6px rgba(0, 0, 0, 0.08); —— 更轻量，适合悬浮态或浅色背景0.5 以上，容易显得脏或加重页面重量透明度只是基础，真正柔和靠组合参数：
16px 或 24px），但必须同步降低 alpha（比如降到 0.06–0.12），否则会发虚发灰0 1px 或 0 2px）+ 低透明度 + 中等模糊（4–8px），适合模拟自然贴边投影别只用黑！深色背景上，纯黑阴影几乎看不见；浅色背景上，深灰阴影可能太重：
rgba(0, 0, 0, 0.08–0.15)
rgba(255, 255, 255, 0.06–0.1)，显影不突兀基本上就这些——换 rgba 是最小改动、最大改善的技巧。关键不是“加阴影”，而是“藏住阴影的边界感”。