Neatbo.

CSS 阴影与圆角

调整多层阴影,并可同时输出独立角的圆角样式。

浏览器本地处理输入参数输出CSS
  1. 1添加输入
  2. 2调整设置
  3. 3获取结果

工具输入和文件在当前浏览器处理,不会上传。

输入内容

切换工具时在当前标签页临时保留输入。刷新或关闭后清除,较大的结果可能需要重新生成。

⌘ / Ctrl + Enter 运行

阴影层

0 个字符 · 0 字节
处理选项

先填写标记为必填的选项,其余可保留默认值。

正在准备处理工具…

开始之前

调整多层阴影,并可同时输出独立角的圆角样式。依据 x、y、模糊、扩展、颜色和内阴影参数生成最多五层阴影。预览使用与复制结果相同的 CSS。

如何使用

  1. 设置已有阴影层的颜色、偏移、模糊和扩展;需要时可再添加阴影,最多五层。
  2. 按需开启圆角并设置关联或独立的四个角,再生成 CSS。阴影层下方的 JSON 编辑框可选用。
  3. 查看 CSS 结果,确认无误后使用结果区提供的复制或下载操作。

支持范围与限制

粘贴文本最多 1 MiB;处理后请核对结果。

操作示例

示例输入

[{"x":1,"y":2,"blur":3,"spread":0,"color":"#0008"}]
示例参数
{}

示例输出

box-shadow: 1px 2px 3px 0px rgba(0, 0, 0, 0.533333);

出现问题时

请使用已说明的输入格式,并遵守界面限制。用于其他文档或应用前请复核结果。修改输入会将旧结果标为已过期;运行失败会清除旧结果。

常见问题

我的文件会上传吗?

不会。文件和工具输入在当前浏览器处理;站内切换可在同一标签页暂存工作状态。刷新或关闭标签页后无法恢复,请及时下载需要保留的结果。

需要检查结果的哪些方面?

依据 x、y、模糊、扩展、颜色和内阴影参数生成最多五层阴影。预览使用与复制结果相同的安全 CSS。

文档与延伸阅读

相关工具