lock文件不会上传到服务器
CSS阴影生成器是一款免费在线工具，可视化编辑box-shadow属性。 通过滑块调整偏移、模糊、扩展和颜色，实时预览。 支持多重阴影和inset。 在浏览器中处理，完全免费。 盒子阴影生成器可提升网页与UI设计以及前端开发的工作效率。 无需安装或登录，在电脑和手机的浏览器中即可直接使用。
如何使用盒子阴影生成器?
- 用滑块调整水平/垂直偏移、模糊和扩展值。
- 设置阴影颜色和透明度。
- 复制生成的CSS代码用于项目。
盒子阴影生成器常见问题
可以同时添加多个阴影吗？
可以，可以添加多个阴影来创建复杂的深度和效果。每个阴影可以单独调整。
什么是inset阴影？
inset阴影显示在元素内部而非外部。普通box-shadow在外部显示，添加inset可以创建凹陷效果。
阴影看起来很假，怎样才自然？
现实中的阴影并不是黑色，而更接近背景色变暗，并且越往外越模糊。与其加一层 30% 黑的浓重阴影，不如叠两三层极淡的阴影、各用不同的模糊半径——比如贴边一层 1px、后面一层 8px、更外面一层 24px 极淡。假设光源在上方，只给垂直偏移，水平偏移保持 0。
阴影用多了会让页面变慢吗？
在静止布局里几乎没有影响，但一旦加上动画就不同了。让 box-shadow 的值在悬停时过渡，会迫使浏览器每一帧重新计算模糊，在低配设备上会明显卡顿。如果需要交互时阴影变大的效果，改为对预先绘制好的阴影层做 opacity 或 transform 动画，会流畅得多。
如何充分利用盒子阴影生成器?
- 用两三层模糊半径不同的阴影叠加，比单独一层大模糊看起来自然得多。
- 透明度控制在 0.08-0.15，纯黑不透明的阴影在屏幕上会显得发脏。
- 深色模式下阴影几乎看不见，可以改用一条浅色描边来表现层次。
Powered by Patrache Studio Tools