Tailwind 阴影生成器
可视化构建多层阴影，得到 Tailwind shadow-[...] 任意值类名以及原生 CSS。
工作原理
每一层的 x 偏移、y 偏移、模糊、扩散、颜色和内阴影开关会组装成一段
box-shadow，多层之间用逗号连接，这是标准的 CSS 多重阴影写法。对于
Tailwind 类名，同一段值会把空格替换成下划线、逗号保持原样（Tailwind 的任意值解析器
期望类似 shadow-[0_4px_6px_rgba(0,0,0,0.1)] 这样的写法），
再包裹进 shadow-[...]。预览框实际的 box-shadow
样式会设为原生 CSS 版本，所以你看到的效果与两种输出完全一致。
一切都在本页面的 JavaScript 中根据你设置的值计算得出，不会上传任何内容。
常见问题
Tailwind 中的任意值阴影类是怎么工作的？
Tailwind 允许你直接写 shadow-[<任意 CSS 值>]，它会原样编译成 box-shadow: <任意 CSS 值>，不需要修改配置文件。值内部的空格需要替换成下划线，这一点本工具会自动为你处理。
可以叠加多层阴影吗？
可以，点击“添加图层”即可再叠加一层阴影。真正的 box-shadow 支持用逗号分隔的多层写法，本工具生成任意值类名时也是同样的方式，用逗号连接各层。
这些内容会被发送到别的地方吗？
不会，阴影完全通过你浏览器的 CSS 引擎构建和预览，不会上传任何内容。