SVG to PNG Converter
One input per line. Output is numbered to match the input order.
Pinned tools are listed in your favourites on the home page.Copies a link to this tool that carries your current input, so it opens ready to run.Gives you an iframe snippet for putting this tool on your own site.
Ctrl+Enter Run · Ctrl+Shift+C Copy · Esc Clear
Understand SVG to PNG Converter
把粘贴的 SVG 标记按你选择的尺寸和倍数栅格化为可下载的 PNG，全部在浏览器中完成。
How it works
标记会被作为图像加载，绘制到指定像素尺寸的 HTML canvas 上，再导出为 PNG。由于 SVG 与分辨率无关而 PNG 不是，缩放倍数就是全部关键：把一个 200×200 的图标按 3× 渲染会得到 600×600 的位图，在高密度屏幕上依然锐利，而 1× 在那里会显得发虚。输出自那一刻起就是固定像素——之后再调整 PNG 尺寸会使其劣化，而源 SVG 本可以按任意尺寸渲染。
When to use it
- 由矢量源生成位图 favicon、应用图标或社交预览图
- 为不接受 SVG 的工具、邮件客户端或平台提供图片
- 把基于 SVG 的库生成的图表或示意图导出，用于幻灯片或文档
- 由同一个矢量文件生成 1×、2× 和 3× 资源
Watch out for
- 没有 width、height 或 viewBox 的 SVG 没有固有尺寸，因此栅格化器无从缩放。请先给根元素加上 viewBox 再转换。
- 被栅格化的 SVG 内部不会加载外部资源。由 @font-face 规则引用的网络字体、以及按 URL 引用的图片通常都不会被取回——请先把文字转为路径，否则你的标签会以回退字体渲染，甚至根本不显示。
- 透明度会保留，但背景不会凭空出现。没有背景矩形的 SVG 会导出成背景透明的 PNG，在深色界面上看起来就像图片丢失了。
- PNG 通常是更大的那个文件。一个作为 SVG 只有 2 KB 的扁平矢量图标，做成 3× 的 PNG 可能有 40 KB，因此只有当目标环境确实无法接受矢量时才去转换。
Not the right tool for: 任何留在网页上、且能接受矢量的场景。SVG 能适配每一种显示设备、体积更小，还能用 CSS 设置样式——只有当目标环境逼你这么做时才栅格化。
Frequently Asked Questions
如何把 SVG 转换成 PNG？
粘贴 SVG 标记或拖入一个 .svg 文件，选择缩放倍数或直接输入确切的宽高，然后点击转换为 PNG 并下载结果。整个转换在你浏览器的 canvas 上完成，文件不会被上传。
如何以高分辨率导出 SVG？
由于 SVG 是矢量的，输出尺寸由你决定：使用 4× 或 8× 按钮，或者输入一个宽度（例如 2048），高度会按宽高比自动跟随。与把 PNG 放大不同，这里是重新渲染矢量，因此在任何尺寸下边缘都保持锐利。
为什么我的 SVG 渲染出来字体不对或图片缺失？
栅格化发生在一个隔离的图像上下文中，它无法获取外部资源，因此网络字体和外链图片都不会被加载。请在转换前把文字转为路径、把图片内嵌为 data URI，这样 PNG 就会与原图完全一致。
How to Use SVG to PNG Converter
- Paste or type your input in the input area above.
- The tool processes your input automatically or click Run.
- Copy or download the result using the action buttons.
- Use Ctrl+Enter to run quickly from the keyboard.