CSS 阴影生成器

通过滑块和颜色选择器调整以下参数：

• 水平偏移 / 垂直偏移：范围 -50px~50px，控制阴影在水平和垂直方向的位移。
• 模糊半径：范围 0~100px，数值越大阴影边缘越柔和。
• 扩展半径：范围 -50~50px，正值扩大阴影范围，负值收缩。
• 颜色：通过颜色选择器设置阴影基础颜色。
• 透明度：范围 0%~100%，控制阴影的 alpha 通道。
• 内阴影：勾选后在 box-shadow 前加上 inset，效果由外部投影变为内部凹陷阴影。

预览区的方块会实时应用当前阴影设置，底部代码框同步生成 box-shadow: ...; 代码，点击「复制 CSS」即可复制。

本工具是 box-shadow 属性的可视化调试工具，将偏移、模糊、扩展、颜色、透明度、内外阴影六个维度全部转化为滑块和颜色选择器，所见即所得地生成阴影代码。

• 水平/垂直偏移、模糊半径、扩展半径均通过滑块实时调节，数值范围经过预设覆盖常见阴影场景。
• 颜色选择器搭配透明度滑块，最终转换为 rgba() 格式写入代码，避免手写颜色透明度换算。
• 支持外阴影与内阴影（inset）一键切换，覆盖投影卡片、凹陷输入框等不同视觉需求。
• 预览方块实时应用当前阴影效果，调整参数时可直接观察结果。