SVG 工具

SVG 代码转 PNG

粘贴 SVG 代码或打开 SVG 文件,选择输出大小和背景,然后下载清晰的 PNG 图像。

将 SVG 文件拖放到此处

在你的浏览器中处理。文件永远不会上传。

该工具使用浏览器的内置引擎渲染 SVG。没有上传任何内容。 打开 VectorCraft

如何将 SVG 转换为 PNG

  1. 1

    粘贴 SVG 代码、打开 SVG 文件或尝试示例。

  2. 2

    选择宽度(1×、2×、4×或任何尺寸)和透明、白色或自定义背景。

  3. 3

    下载 PNG。

示例

徽标只能以 SVG 形式提供,但幻灯片工具需要 PNG 形式。粘贴代码,选择 4× 以获得具有透明背景的清晰结果,然后下载。

按使用场景选择输出尺寸

PNG 的像素数量固定,不会保留 SVG 的无限缩放能力。例如在两倍像素密度屏幕上显示 48 像素图标,可导出 96 像素宽的图片。高度跟随 SVG 比例,输出最长边不超过 8192 像素。

放大输出有利于矢量路径,但不能恢复 SVG 内嵌低分辨率位图缺失的细节。优先选择实际需要的尺寸:大画布消耗更多内存,在手机上可能更慢。如果导出失败,请缩小尺寸后重试。

透明背景、字体与外部图片

需要放在不同底色上的图标或标志可选透明背景;需要固定底色时可选白色或自定义颜色。浅色图形应分别在深浅背景下检查,看似空白的预览可能只是白色图形与背景重合。下载的 PNG 会保留所选背景。

转换前尽量让 SVG 自包含。远程图片和网络字体可能无法被浏览器图片渲染器读取,可嵌入图片或在合适的编辑器中将重要文字转为轮廓。本工具使用浏览器画布,不会补齐缺失资源或安装字体。保留原始 SVG,并在目标场景中检查 PNG。

SVG 代码转 PNG 的实际导出检查

例如,要把正方形 SVG 图标导出为 96 像素的头像图片:粘贴完整的 SVG 代码,包括根元素和 viewBox,先检查预览。将宽度设为 96 像素,高度会按源文件比例变化。图片将用于不同背景时选择透明;需要实色背景时选择实际使用的颜色。转换并下载后,打开 PNG,确认像素尺寸。

SVG 代码转 PNG 后如果结果空白,先检查源文件预览。白色图形配透明背景,在某些图片查看器中可能看起来像空图。路径不完整、viewBox 不正确或外部图片缺失,也可能造成这种结果。可以尝试内置示例,区分源文件问题和浏览器、导出问题。大型图像即使没有超过尺寸上限,也可能耗尽可用画布内存;请缩小输出尺寸再试。

要让图像清晰,尽可能使用矢量路径,并按目标显示尺寸导出。增加像素不能恢复内嵌照片已经缺失的细节。转换后检查小字、细线和被裁切的边缘,保留原 SVG 以便以后重新调整尺寸。SVG 代码转图片得到的是栅格副本;之后编辑 PNG,并不会保留源路径,也不能把文字当作独立文本继续编辑。

功能说明与当前限制

  • 最长边输出高达 8192 像素。
  • SVG 引用的外部图像和 Web 字体可能无法渲染;首先嵌入它们或将文本转换为轮廓。
  • 渲染使用浏览器的引擎,因此不同浏览器的结果可能略有不同。

SVG 转 PNG 常见问题

PNG会模糊吗?

矢量路径按所选尺寸渲染,请为使用场景选择足够的像素;SVG 内嵌的低分辨率位图仍可能模糊。

我的 SVG 已上传吗?

不会。转换发生在你的浏览器中。