SVG 预览编辑

实时预览 SVG 源码并优化导出

本地处理 · 不上传完全免费无水印即开即用

SVG 源码有效 SVG

加载编辑器…

实时预览

什么是SVG 预览编辑?

SVG 预览编辑器带高亮源码编辑器(语法高亮 / 行号 / Tab 缩进),可实时渲染你粘贴的 SVG 源码,边改边看效果;支持一键整形(按层级重新缩进,便于阅读压缩后的一行 SVG)与轻量压缩(去注释、折叠空白)减小体积,支持复制或下载 .svg。适合快速校验图标、微调路径、精简导出的矢量图,纯前端运行,内容不上传。

能力亮点

高亮源码编辑器:语法高亮 + 行号 + Tab 缩进
源码实时预览 + XML 语法校验提示
一键整形(按层级缩进)/ 轻量压缩(去注释 / 空白)
复制或下载 .svg,本地处理、不上传、免费

如何使用SVG 预览编辑

1
在左侧编辑器粘贴或编辑 SVG 源码(带语法高亮与行号)。
2
右侧实时预览渲染效果(棋盘底便于看透明);标题行显示是否为有效 SVG。
3
需要阅读压缩成一行的 SVG,点“整形”按层级重新缩进;需要减小体积点“压缩”。
4
复制源码或下载为 .svg 文件。

常见问题

“整形”和“压缩”有什么区别?

整形按标签层级重新换行缩进,把压缩成一行的 SVG 展开成易读结构,不改变图形;压缩则相反,去注释、折叠标签间空白以减小体积。两者都只动空白与注释,不改动路径与图形本身。

“压缩”做了什么?会改变图形吗?

只去除注释、折叠标签间多余空白与连续空格,不改动路径与图形本身;属轻量优化,并非深度矢量简化(不合并路径、不裁剪精度)。

预览会执行脚本吗?

不会。预览以 <img> 方式载入 SVG,浏览器在图片上下文中强制禁用脚本,即便 SVG 内含 onload / script 也不会执行,可放心粘贴。

支持可视化拖拽绘制吗?

这是源码级预览 / 编辑器,支持任意合法 SVG 的实时预览与文本编辑,不提供可视化拖拽绘制。

内容会上传吗?

不会。渲染、校验、整形与压缩全部在浏览器本地完成,源码不上传、不保存。