开发工具
CSS 效果生成器
实时预览玻璃态、盒阴影、文字阴影、渐变和三角形 CSS
本地处理 · 不上传免费使用无水印
参数变化会实时更新预览与规则，颜色使用六位 HEX。全部本地生成，不上传。预览使用示例元素，导出只包含所选效果；显示区域有限，实际效果还取决于目标元素大小、背景和浏览器支持。
玻璃态预览
什么是CSS 效果生成器?
本地生成玻璃态、盒阴影、文字阴影、线性/径向渐变和四方向三角形 CSS，调整参数实时查看示例，复制或下载完整规则。
能力亮点
- 五种效果实时预览
- 数值滑块与精确输入
- 颜色与不透明度
- 线性/径向渐变
- 四方向三角形
如何使用CSS 效果生成器
- 1
选择效果并调整数值、方向和颜色。
- 2
查看实时预览与对应 CSS 规则。
- 3
复制或下载规则，并将类名应用到目标元素。
常见问题
预览的整个卡片都会导出吗？
不会，只导出所选效果的 CSS 规则，示例元素的尺寸、文字和舞台背景不包含在结果中。
玻璃态为什么可能没有模糊？
背景模糊需要浏览器支持，也需要元素后方有可模糊的内容；不支持时仍可使用背景色和边框。