SVG 优化器（SVGO）
在浏览器中用 SVGO 优化并压缩 SVG 代码。删除编辑器元数据、注释和冗余标记，并通过预览显示节省的体积。
使用 SVGO 默认预设，会保留 viewBox、标题和无障碍描述。
完全在浏览器中运行，您的数据不会被上传。
什么是 SVG 优化器？
SVG 优化器会对你的 SVG 代码运行标准的 SVG 优化库 SVGO。它会移除编辑器元数据、注释、隐藏和空元素，缩短路径数据、数字和颜色，并合并可以合并的内容。你会得到优化后的代码、优化前后的预览以及体积缩减量。
如何使用 SVG 优化器
- 把 SVG 代码粘贴到 SVG 代码 中，或拖放/选择
.svg文件。 - 调整选项：多遍优化（输出更小）、数值精度（小数位）、保留 ID（CSS 或脚本引用时需要）、用 viewBox 替代 width/height（自适应）、格式化输出。
- 对比优化前后的预览和体积标记。
- 复制优化后的 SVG，或以
name-min.svg下载。
示例
100×100 SVG from an editor with an XML declaration, a comment, <metadata>, empty <defs> and a nested <g> around a rect (474 bytes)
<svg xmlns="http://www.w3.org/2000/svg" width="100" height="100" viewBox="0 0 100 100"><path d="M10 10h80v80H10z" style="fill:red;stroke:none"/></svg>
何时使用 SVG 优化器
在把 Figma、Illustrator、Inkscape 或 Sketch 导出的图标、Logo 和插图用于网站或应用之前使用。如果其他地方的 CSS、JavaScript 或 <use> 引用依赖元素 ID，请开启保留 ID（CSS 或脚本引用时需要）。务必检查预览：含有脚本或外部引用的特殊 SVG 可能需要手动调整。
SVG 优化器 的工作原理
工具按需加载 SVGO 4 的浏览器版本，并应用其 preset-default 插件：移除 XML 声明、doctype、注释、元数据和编辑器命名空间，清理属性和数值，把形状转换为路径，折叠分组，重写路径数据和变换，等等。SVGO 4 的默认预设会保留 viewBox、<title> 和非编辑器的 <desc>，因此缩放和无障碍特性得以保留。开启多遍优化后，插件会重复运行，直到输出不再变小。
常见用例
- 在把设计工具导出的图标加入组件库之前缩小它们。
- 清理 SVG Logo，以便内联到 HTML 中。
- 缩小 SVG 雪碧图，加快页面加载。
- 移除会泄露文件路径或作者姓名的编辑器元数据。
安全提示
图片使用 Canvas API 在你的浏览器本地解码、处理和编码，不会上传到任何服务器。
常见问题
SVGO 优化是无损的吗？
使用默认预设时，几乎所有情况下在视觉上都是无损的。把数值精度降得过低（0–1 位小数）可能会让小图形发生偏移，请对比预览。
为什么优化后我的 CSS 失效了？
SVGO 会缩短或移除未使用的 ID。如果你的样式或脚本以它们为目标，请启用保留 ID（CSS 或脚本引用时需要）。
它会删除 viewBox 吗？
不会。SVGO 4 的默认预设会保留 viewBox。可选的用 viewBox 替代 width/height（自适应）则会移除固定尺寸，使 SVG 具备自适应能力。