SVG 查看与编辑器

SVG 文件本质上是代码，只显示图像的查看器只能让您了解一半。在这里打开或粘贴 SVG，就能看到渲染效果、读取声明的尺寸和 viewBox、统计元素数量，并得到便于编辑的格式化代码或用于上线的压缩代码。修改框中的代码后再次运行即可看到编辑结果。由于单独打开的 SVG 可能会运行 JavaScript，您还可以先移除脚本、事件处理程序和外部链接。不会上传任何内容。

使用方法

1. 选择 SVG 文件，或把 SVG 代码粘贴到框中。
2. 选择代码格式：格式化、压缩或保持原样。
3. 对不是自己制作的文件，请保持安全选项开启。
4. 查看预览、尺寸、viewBox 和元素表，并复制代码。
5. 在框中编辑代码后再次运行；也可以按任意宽度导出 PNG。

计算公式

显示尺寸 = width × height 属性（px、pt、mm、cm、in 按每英寸 96 px 换算）；缺少其中之一时按 viewBox 比例计算

只有 viewBox 的 SVG 没有固定尺寸，会缩放到所放入的容器大小。导出 PNG 时使用您设定的宽度，高度由 viewBox（或 width 和 height）推算，因此画面是重新绘制得清晰锐利，而不是把小位图放大。

示例

写成 <svg width="2in" viewBox="0 0 40 20"> 的图标宽度是 2 × 96 = 192 px；按 viewBox 比例 20 ÷ 40，高度为 96 px。以 1024 px 宽度导出 PNG，得到的是 1024 × 512 的图片。