什么是 SVG 优化工具，它会移除什么？

它是一款浏览器内 SVG 压缩工具，会剥离 XML 序言、doctype、注释、元数据、title 和 desc，以及来自 Inkscape、Sodipodi 和 Adobe 等工具的编辑器杂项，然后折叠空白。你可以用开关控制每一步。

如何用本工具压缩 SVG？

将你的 SVG 标记粘贴到输入框，切换你想要的清理项，然后复制优化后的输出。字节数和节省百分比会显示在结果上方，让你确认缩小效果。

优化会改变我的 SVG 的外观吗？

不会，默认设置只移除非视觉数据和空白。视觉路径和形状会被保留，因此渲染后的图形保持完全一致。

我应该移除 width 和 height 属性吗？

仅当你的 SVG 含有 viewBox 时才去掉它们。viewBox 会保持图形可缩放，非常适合响应式和用 CSS 设定尺寸的图标。

SVG 优化工具与 SVGO 有何不同？

它是一款轻量、无依赖的优化工具，在浏览器中覆盖了最常见的 SVGO 清理项，无需安装构建工具或配置 Node 环境。

我的 SVG 会被上传到任何地方吗？

不会。SVG 优化工具在你的浏览器中本地处理你的标记，因此你的数据不会离开你的设备，也不会上传到任何服务器。

SVG 优化工具

压缩 SVG：移除注释、元数据和编辑器残留，并合并空白。

你的 SVG 在浏览器中本地优化，不会上传到任何服务器。

也需要缩小位图图像？试试图像优化工具。

关于 SVG 优化工具

这款 SVG 优化工具会压缩 SVG 标记，让你的图标和图形以更小的体积发布、更快地加载。粘贴从 Figma、Illustrator、Inkscape 或 Sketch 导出的 SVG，工具会剥离 XML 序言、doctype、注释、元数据，以及来自 Inkscape、Sodipodi 和 Adobe 的编辑器特定杂项，然后折叠空白以削减字节。你还可以选择性地去掉根元素的 width 和 height 属性，让 viewBox 保持图形完全可缩放，适配响应式布局。它是一款方便、轻量的 SVGO 替代工具，适合前端开发者、设计师，以及任何需要压缩 SVG 或将图标内联到 HTML、CSS 或 React 组件中的人。所有处理都在你的浏览器本地完成，工具会报告优化前后的字节数，让你确切看到文件缩小了多少。

功能特性

剥离内联和网页 SVG 不需要的 XML 序言和 DOCTYPE 声明
移除注释以清理导出的标记
删除会增大文件体积的 metadata、title 和 desc 元素
清理来自 Inkscape、Sodipodi 和 Adobe 的编辑器杂项，包括带命名空间的属性
可选地移除根元素的 width 和 height，让 viewBox 保持图形可缩放
折叠标签之间的空白和多余间距
显示优化后的字节数和节省百分比
可逐项开关每项清理，让你精确保留所需的标记

如何使用 SVG 优化工具

将你的 SVG 源代码粘贴到输入框。
切换注释、元数据、编辑器数据、尺寸和空白等选项以满足你的需求。
查看优化后的输出及其上方显示的字节节省。
复制优化后的 SVG 并放入你的项目。

示例

输入

<?xml version="1.0"?>
<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24">
  <!-- 心形图标 -->
  <title>心形</title>
  <path d="M12 21 4 13a4 4 0 1 1 8-5 4 4 0 1 1 8 5z"/>
</svg>

输出

<svg xmlns="http://www.w3.org/2000/svg" width="24" height="24" viewBox="0 0 24 24"><path d="M12 21 4 13a4 4 0 1 1 8-5 4 4 0 1 1 8 5z"/></svg>

移除了序言、注释和 title，并折叠了空白。

常见错误与故障排除

移除尺寸后图形消失或大小不对。 — 仅当 SVG 含有 viewBox 时，移除 width 和 height 才有效。如果它没有 viewBox，请关闭尺寸开关。
被你的 CSS 或 JavaScript 引用的 ID 或标签被清理掉了。 — 编辑器数据选项会移除 data-name 和带命名空间的编辑器属性。如果你的代码依赖这些钩子，请将其关闭。
由于 title 和 desc 被剥离，无障碍功能失效。 — 元数据选项会移除 title 和 desc 元素。当你依赖它们作为屏幕阅读器标签时，请禁用该选项。
粘贴后输出为空。 — 优化工具需要实际的 SVG 标记；请确保你粘贴的是完整的 svg 元素，而非仅一个文件路径或二进制图像。

常见问题

什么是 SVG 优化工具，它会移除什么？: 它是一款浏览器内 SVG 压缩工具，会剥离 XML 序言、doctype、注释、元数据、title 和 desc，以及来自 Inkscape、Sodipodi 和 Adobe 等工具的编辑器杂项，然后折叠空白。你可以用开关控制每一步。
如何用本工具压缩 SVG？: 将你的 SVG 标记粘贴到输入框，切换你想要的清理项，然后复制优化后的输出。字节数和节省百分比会显示在结果上方，让你确认缩小效果。
优化会改变我的 SVG 的外观吗？: 不会，默认设置只移除非视觉数据和空白。视觉路径和形状会被保留，因此渲染后的图形保持完全一致。
我应该移除 width 和 height 属性吗？: 仅当你的 SVG 含有 viewBox 时才去掉它们。viewBox 会保持图形可缩放，非常适合响应式和用 CSS 设定尺寸的图标。
SVG 优化工具与 SVGO 有何不同？: 它是一款轻量、无依赖的优化工具，在浏览器中覆盖了最常见的 SVGO 清理项，无需安装构建工具或配置 Node 环境。
我的 SVG 会被上传到任何地方吗？: 不会。SVG 优化工具在你的浏览器中本地处理你的标记，因此你的数据不会离开你的设备，也不会上传到任何服务器。