All Tools / 开发者工具 / CSS Box Shadow 生成器 — 免费可视化编辑器
预览
设置
X 偏移 5px
Y 偏移 5px
模糊 15px
扩展 0px
颜色
透明度 20%
内阴影
图层
CSS 代码

CSS Box Shadow 生成器

工具功能

通过滑块调整 X/Y 偏移、模糊、扩展、颜色和透明度,实时查看阴影更新。切换内阴影在外部和内部阴影之间切换。添加多个阴影图层实现深度效果。应用预设快速开始,然后精细调整。点击一下复制 CSS 代码。

使用方法

  1. 选择预设或从默认值开始。
  2. 调整滑块设置偏移、模糊、扩展和透明度。
  3. 点击颜色色板更改阴影颜色。
  4. 切换内阴影获得内部阴影效果。使用+ 添加图层叠加效果。
  5. 点击复制复制生成的 CSS。