CSS 阴影生成器
可视化调整参数,实时预览并生成 box-shadow / text-shadow CSS 代码
背景:
形状:
背景:
Hello
关于 CSS 阴影生成器
- 支持
box-shadow(元素阴影)和text-shadow(文字阴影)两种模式 - 通过滑块实时调整参数,预览区即时更新,所见即所得
- 支持多层叠加阴影效果(最多 5 层),生成完整 CSS 代码含
-webkit-前缀
操作说明
- 调整滑块参数,预览区实时更新阴影效果
- 点击「添加层」可叠加多个阴影,点击层右侧 删除该层
- 点击「生成 CSS」输出完整代码,一键复制即可使用
注意事项
- 最多支持 5 层叠加阴影,超出后「添加层」按钮将禁用
- 颜色透明度通过
rgba()实现,兼容所有现代浏览器 - 所有处理均在浏览器本地完成,不上传任何数据