SVG 压缩/优化
压缩和优化 SVG 文件以减小文件大小而不损失质量。清理代码、移除未使用元素，并为生产使用进行最小化。
- 减小文件大小 - 通过智能优化压缩 SVG 高达 70%
- 可自定义选项 - 控制精度、移除注释、清理路径
- 前后预览 - 即时查看代码对比和大小减少
- 100% 隐私安全 - 所有处理都在本地浏览器中完成
- 批量选项 - 通过 10+ 配置选项微调优化
拖放 SVG 文件到此处进行转换
支持单个 SVG 文件上传
使用教程
按照这些分步指南有效优化您的 SVG 文件。
基础 SVG 优化
初学者2 分钟学习如何使用默认设置压缩 SVG 文件以获得最大文件大小减少。
- 1
上传 SVG 文件
点击上传区域或拖拽 .svg 文件到指定区域。工具接受任何有效的 SVG 文件。
- 2
查看默认选项
默认优化设置对大多数 SVG 都很适用。精度设置为 3 位小数，移除注释和未使用元素等常见优化已启用。
- 3
点击开始优化
点击「开始优化」按钮。工具使用 SVGO 库在浏览器中即时处理您的 SVG。
- 4
查看结果并下载
查看文件大小减少百分比和前后代码对比。如果满意，点击「下载优化后的文件」保存 .min.svg 文件。
自定义优化选项
中级4 分钟学习如何针对特定用例微调优化设置。
- 1
调整精度级别
使用精度滑块控制路径坐标中的小数位数。较高精度（4-6）= 文件较大但更准确。较低精度（1-2）= 文件较小但可能影响曲线。
💡 Tip: 对于图标和标志，2-3 精度通常足够。对于详细插图，使用 4-5。
- 2
切换优化选项
启用/禁用特定优化：移除注释、移除隐藏元素、转换颜色、合并路径、折叠分组、转换路径数据。
- 3
何时禁用路径数据转换
如果优化后的 SVG 看起来失真，禁用「转换路径数据」。此选项会激进地优化路径，但可能影响复杂曲线。
- 4
测试和迭代
优化后，视觉上对比您的 SVG。如果出现问题，调整选项并重新优化。前后预览有助于识别变化。
生产环境高级 SVG 优化
高级5 分钟为 Web 开发和设计系统优化 SVG 的最佳实践。
- 1
对于图标系统
使用精度 2-3，启用「移除空容器」、「折叠分组」和「合并路径」。这会生成最小的 SVG，非常适合图标精灵和内联使用。
💡 Tip: 优化后在多个尺寸下测试图标，确保描边宽度保持一致。
- 2
对于插图和艺术作品
使用精度 4-5，禁用「转换路径数据」以保留艺术曲线。保持「移除注释」和「移除隐藏元素」启用。
- 3
对于动画 SVG
小心使用「折叠分组」和「合并路径」，因为这些可能会破坏 CSS 或 SMIL 动画。如果 SVG 有动画，禁用这些选项。
- 4
对于无障碍访问
优化器默认保留 title 和 desc 标签。优化后务必测试屏幕阅读器行为，确保无障碍访问得到维护。
"这个 SVG 优化器对生产构建太棒了！我把图标集从 500KB 减少到 150KB——减少了 70%。精度控制在文件大小和视觉质量之间找到完美平衡点。"
"我每天都用这个工具清理设计工具导出的 SVG。Figma 和 Illustrator 总是添加那么多冗余代码——这个优化器把它们都清理掉了。前后预览对验证非常有帮助。"
"可自定义选项让这个工具脱颖而出。我可以针对不同用例调整精度——背景图案用低精度，标志用高精度。全部本地运行，无需服务器上传！"
"这是我用过的最好的在线 SVG 优化器！「合并路径」和「折叠分组」功能非常适合为图标精灵表准备图标集。我的图标库现在小了 65%。"
"我在 React 组件中内联 SVG，文件大小很重要。这个优化器显著减少了我的组件包大小。喜欢可以禁用路径转换来保留复杂曲线。"
"精度滑块对我的工作是革命性的。我可以在文件大小和曲线保真度之间找到精确平衡。对于详细插图，我推荐 4-5 精度并禁用路径转换。"
常见问题
查找关于 SVG 优化的常见问题的答案。