快速上手

  1. 打开 Box Shadow 工具(盒阴影)。在左侧面板调整水平偏移、垂直偏移、模糊半径、扩展半径和颜色。实时预览区会同步显示变化。
  2. 点击"复制CSS"按钮,直接获取 box-shadow 属性值,粘贴到你的样式表中。

文字阴影技巧

  1. 切换到 Text Shadow 工具(文字阴影)。输入文本内容,设置偏移、模糊和颜色。
  2. 使用"叠加阴影"功能可添加多层阴影,打造立体或发光效果。
  3. 完成后复制生成的 text-shadow 代码。

高级用法

  • 预设模板:两工具均提供流行阴影预设(如扁平阴影、霓虹光),一键应用。
  • 导出与分享:将阴影配置导出为JSON,或生成短链接分享给团队。

FAQ

Q: 盒阴影和文字阴影可以组合使用吗?
A: 可以。分别从两个工具复制代码,在CSS中同时写在一个元素上即可。

Q: 如何让阴影更柔和?
A: 增大模糊半径,并适当降低颜色透明度(如使用 rgba 颜色)。

Q: 支持负值偏移吗?
A: 支持。负水平偏移让阴影向左,负垂直偏移让阴影向上。