SVG 转 PNG

将SVG拖放或者粘贴到虚线区域

如何使用 SVG 转 PNG 工具?

  1. 点击虚线区域的选择SVG图片按钮,或者直接从电脑本地拖拽SVG文件到虚线区域
  2. 点击下载图片按钮,将会成功下载转换后的图片文件

什么是 SVG?

SVG,即可缩放矢量图形(Scalable Vector Graphics),是一种广泛用于图形的文件格式,内置支持动画。SVG图像的关键特点包括:

  1. 基于XML的优势:由于基于XML,可以轻松搜索、索引、编写脚本或压缩SVG图像。可以使用文本编辑器或矢量设计工具(如Adobe Illustrator、Inkscape或CorelDRAW)进行创建和编辑。

  2. 可扩展性:SVG图像在调整大小时保持质量,并且可以以任意分辨率打印。

  3. 动画潜力:可以使用JavaScript对SVG图像进行动画处理,从而实现简单和复杂的动画效果。

SVG的优缺点: 优点:

  • 分辨率无关性:SVG可在不损失质量的情况下进行缩放。
  • 浏览器原生支持:现代浏览器可以本地显示SVG。
  • 可以使用矢量工具进行编辑:可以使用矢量设计软件编辑SVG。

缺点:

  • 在旧版浏览器中支持有限。
  • 在不同平台上解释不一致。
  • 不适用于像照片这样具有高度细节的复杂图像。

什么是 PNG?

PNG,即可移植网络图形(Portable Network Graphics),是一种栅格图像格式,因其高质量和多功能性而闻名,得益于其无损压缩。PNG图像的关键特点包括:

  1. 基于像素:与SVG不同,PNG图像由像素组成,无法进行缩放而不丢失细节。

  2. 透明度:PNG图像可以具有透明背景,适用于叠加和背景。

PNG的优缺点: 优点:

  • 无损质量:PNG在压缩后保持图像质量。
  • 多功能性:由于其灵活性,PNG具有各种应用。

缺点:

  • 缺乏像SVG那样的可扩展性。
  • 与SVG相比,文件大小较大,因为包含了像素数据。

选择SVG还是PNG

两种格式具有不同的用途,因此并不存在哪一种比另一种更好。PNG因其多功能性而受到平面设计师的青睐,而SVG由于其可扩展性和独特特性而在图标、标志、极简设计和字体方面广受欢迎。

从SVG转换为PNG

存在多种方法可以将SVG转换为PNG。尽管可以使用诸如Adobe Photoshop之类的软件,但更有效且具有成本效益的方法是使用在线转换工具,如我们这款SVG转PNG工具。这消除了专有软件的需求,简化了转换过程。

相关工具

基本原理

  • Canvas 上的 JavaScript SVG 解析器和渲染器: canvg
  • 使用 Javascript 创建、读取和编辑 .zip 文件: jszip