生产环境的玻璃拟态：做对，或干脆别做
玻璃在原型图里很美，在生产里很脆。一份实用手册：磨砂面板何时有益、何时有害，以及如何叠加模糊、着色与描边，让它既清晰又流畅。
约 7 分钟
玻璃是打光技巧，不是布局
磨砂玻璃只有在压着有内容的东西时才成立——照片、视频、渐变。在纯白背景上它读作脏灰。整套技巧在于对比：模糊掉背后的混乱，保持前面的文字锐利，让背景干活。
配方，按重要度排序
- 模糊——backdrop-filter: blur(16–24px)。太少像涂脏，太多像奶白。16–20px 是甜点。
- 着色——半透明填充（白 6–10%）把面板从背景上抬起来。略过它，你得到的是飘浮文字而非卡片。
- 描边——1px rgba(255,255,255,0.2)。这是它读作玻璃而非截图的关键。
- 景深——柔和的 20–40px 外阴影，让面板浮起而非浮在里头。
- 减弱动效——在 prefers-reduced-motion 下关闭模糊入场动画。
如果看不到面板背后的背景在动，你做的不是玻璃，是贴纸。
做对这项技术的组件
✦玻璃导航栏滚动内容之上保持可读的磨砂导航。✦3D 翻转卡片不用一条 backdrop-filter 也能做出悬停景深。当背景静止或平面时，跳过玻璃，改用实色表面或细微渐变——加载更快，读起来更干净。