🔍 什么是 Glassmorphism？
半透明毛玻璃效果 + 背景模糊 + 微妙边框 + 柔和阴影 代表产品：Apple Vision Pro UI、macOS 控制中心、Windows 11
✅ 正确用法：
用在浮层和叠加层 弹窗、下拉菜单、悬浮面板这些"盖在内容之上"的元素用毛玻璃效果，天然合理。它暗示了"这一层在上面"的空间关系
用在导航栏和工具栏 顶部导航做半透明 → 滚动时内容从背后透过来 → 既节省空间又有层次感。iOS 用了很多年了
用在卡片的部分区域 不是整个卡片都做毛玻璃，而是卡片的某一层用半透明+模糊，制造精致的层叠效果
❌ 错误用法：
所有元素都是毛玻璃 → 整个页面糊成一片，什么都看不清 背景太杂乱 → 毛玻璃透出来的是一坨色彩噪音 模糊度不够 → 不像玻璃像塑料膜，廉价感拉满 在文字密集区域使用 → 背景透上来严重干扰可读性
🎨 CSS 参考参数：
background: rgba(255, 255, 255, 0.15) backdrop-filter: blur(20px) border: 1px solid rgba(255, 255, 255, 0.2) border-radius: 16px
关键是那条微妙的半透明白色边框，它模拟了真实玻璃边缘的光折射，少了它就少了灵魂
任何设计趋势都不该无脑套用。理解它为什么好看、什么场景适合，比追不追风格重要得多💡
