阴影生成器

在线 CSS 阴影生成器,调节偏移、模糊、扩散与透明度,实时预览并一键复制 box-shadow。

纯浏览器本地运行,数据不上传服务器

CSS 代码

使用说明

  1. 拖动滑块设置水平/垂直偏移、模糊与扩散半径,选择颜色与透明度。
  2. “内阴影”开关切换 inset 模式,实时预览同步更新。
  3. 复制 CSS 代码即可用于按钮、卡片、弹窗等元素。

常见问题

扩散和模糊有什么区别?
模糊决定阴影边缘的柔和程度;扩散让阴影整体放大或缩小(负值为收缩),可做出描边式阴影。
内阴影用在什么地方?
内阴影适合凹陷效果、输入框内嵌、按钮按下态等场景。
可以叠加多层阴影吗?
本工具生成单层阴影;多层效果可复制代码后用逗号手动拼接多层 box-shadow。
反馈