1. 选择叠加层类型：纯色、渐变或毛玻璃效果
2. 调整颜色、不透明度和高级参数
3. 实时预览叠加效果
4. 一键复制生成的 CSS 或完整 HTML+CSS
纯色叠加(Solid Overlay)最常用，适合暗色遮罩、图片上的文字背景。渐变叠加(Gradient Overlay)适合从暗到亮的过渡效果，常用于横幅和卡片。毛玻璃(Glassmorphism/backdrop-filter)效果是近年来流行的设计趋势，适合模态框、导航栏和卡片，提供优雅的半透明模糊背景。
backdrop-filter 在现代浏览器中得到良好支持：Chrome 76+、Edge 79+、Firefox 103+、Safari 13+。对于不支持 backdrop-filter 的浏览器，建议提供一个纯色或渐变叠加作为 fallback。本工具生成的代码包含基本的兜底方案。
混合模式决定了叠加层颜色与底层内容的合成方式。Overlay 模式增强对比度，Multiply 让底层变暗，Screen 让底层变亮。不同混合模式适合不同的设计风格，尝试使用可以看到各种创意效果。