SVG是什么格式？一篇看懂SVG矢量图的原理与用途

一、SVG 是什么？

SVG 全称 Scalable Vector Graphics（可缩放矢量图形），是一种基于 XML 的开放矢量图形格式，由 W3C 制定标准。与 PNG、JPG 用像素点阵记录图像不同，SVG 用数学公式描述图形：一条直线、一个圆、一段贝塞尔曲线，都以坐标与路径指令的形式写在文件里。

正因如此，SVG 无论放大多少倍都不会模糊——浏览器只是按新的尺寸重新"画"一遍公式，而不是拉伸像素。这也是"矢量"二字的含义。

二、SVG 与 PNG / JPG 的区别

对比项	SVG	PNG / JPG
记录方式	数学路径（矢量）	像素点阵（位图）
放大表现	无限放大不失真	放大出现锯齿、模糊
文件体积	简单图形极小（几KB）	随分辨率线性增长
可编辑性	文本可编辑、可改色、可动画	需图像处理软件
适合内容	图标、Logo、插画、图表	照片、复杂光影

三、SVG 的典型用途

• 网站图标与 Logo：一套 SVG 适配所有屏幕密度，Retina 屏依旧锐利；
• 插画与图表：数据可视化库（如 ECharts、Recharts）默认输出 SVG；
• 印刷与雕刻：激光雕刻、刻字机、UV 打印普遍接受 SVG 路径；
• 动画：SVG 路径可直接用 CSS / SMIL / JS 驱动，实现描边动画等效果。

四、如何打开与编辑 SVG？

浏览器（Chrome / Edge / Firefox / Safari）可以直接打开 SVG；设计软件 Illustrator、Figma、Inkscape（免费）都支持编辑。如果只想快速改色、去背景或擦除局部，可以使用 PolySVG 在线 SVG 编辑器，无需安装任何软件。

五、手头的 PNG / JPG 怎么变成 SVG？

使用 PolySVG 图片转SVG工具，上传位图后自研模型会自动完成颜色量化、轮廓追踪与曲线拟合，几秒内得到可编辑的 SVG，还能一键去除背景。整个过程免费、无需注册。

小结：SVG 是"用公式画画"的格式，天生适合图标、Logo 与一切需要缩放的图形；照片类内容仍建议使用 JPG / WEBP。