玻璃拟态生成器
可视化生成 Glassmorphism 玻璃拟态效果，通过背景模糊、半透明和精细边框模拟毛玻璃视觉。
玻璃参数
模糊度 (Blur)10px
透明度0.2
边框透明度0.25
圆角16px
预设效果
实时预览
Glassmorphism
background: #ffffff33;
backdrop-filter: blur(10px);
-webkit-backdrop-filter: blur(10px);
border: 1px solid #ffffff40;
border-radius: 16px;
box-shadow: 0 8px 32px 0 rgba(31, 38, 135, 0.37);功能介绍
玻璃拟态（Glassmorphism）通过背景模糊、半透明白色和精细边框，模拟毛玻璃的视觉效果，强调层次感和深度。广泛应用于现代 UI 设计中。
- 模糊度：控制 backdrop-filter 的模糊程度，值越大毛玻璃效果越明显。
- 透明度：控制背景色的透明程度，低透明度配合模糊才能呈现玻璃质感。
- 边框：半透明边框增强玻璃边缘的折射感，通常使用白色低透明度。
- 预设模板：提供常用玻璃拟态预设，一键应用快速开始。
使用技巧
- 背景选择：玻璃拟态需要有色彩丰富的背景才能体现效果，建议使用渐变或图片背景。
- 参数调节：模糊度建议 8-16px，透明度建议 0.1-0.3，过高会失去玻璃质感。
- 代码复制：支持 CSS 和 Tailwind 两种格式，点击复制按钮即可使用。
- 兼容性：backdrop-filter 在现代浏览器中支持良好，旧版浏览器需添加 -webkit- 前缀。