◩
图片与设计工具
Box Shadow Generator
Box Shadow Generator 在浏览器中运行,用于检查、转换或准备结果,不会把输入发送到服务器。
图片与设计工具
Input / output
Shadow preview
2 layers
CSS 코드
box-shadow: 0px 8px 24px -8px rgb(0 0 0 / 0.18), 0px 2px 6px 0px rgb(37 99 235 / 0.12);
Tailwind shadow
shadow-[0px_8px_24px_-8px_rgb(0_0_0_/_0.18),_0px_2px_6px_0px_rgb(37_99_235_/_0.12)]
Shadow layers
Layer 1
Layer 2
HelpOpen usage notes, examples, practical tips, and FAQ only when you need them.
What is this tool?
Box Shadow Generator 是面向图片与设计流程的本地浏览器工具,输入、选项和结果都在同一页面完成。
How to use it
- 粘贴输入
在输入区域输入或粘贴要处理的值。
- 调整选项
选择适合 box shadow, CSS shadow, elevation 的模式、格式或单位。
- 检查结果
运行工具,确认结果后再复制或下载。
Examples
Box Shadow Generator 示例
- Input
- 示例输入
- Output
- 在浏览器中检查后的输出。
Practical tips
- 内容较大时,先从小样本开始。
- 广告会保持在主要控件和结果区域之外。
FAQ
Box Shadow Generator 应该输入什么?
请输入与页面任务匹配的值,并在运行前调整选项。
可以复制 Box Shadow Generator 的结果吗?
可以。检查结果后即可复制或下载。
Box Shadow Generator 支持移动端吗?
支持。输入、选项和结果会在小屏幕上纵向排列。
输入会发送到服务器吗?
不会。该工具设计为在浏览器内处理输入。