How do I convert an SVG to PNG here?

Paste the SVG code into the source box, press Open SVG, or drop the .svg file on the stage, and the PNG is drawn as soon as the markup reads cleanly. Check the width, which is filled in from the file, or type the one you need, and pick 1x, 2x or 4x. Choose Transparent or White for the background. Then press Download PNG to save it, named after the file and its size, such as logo-1200x600.png, or Copy image to paste it straight into a document or chat.

Can I paste SVG code copied from a web page or an icon set?

Yes. Copy the svg element itself, from the opening , and paste it into the source box. SVG written inside a web page usually leaves out the xmlns declaration that a standalone file needs, and without it a browser will not draw the markup as a picture, so the page adds it before drawing, along with the xlink declaration when the code uses xlink:href. Markup that only HTML accepts, such as an attribute with no value, still needs fixing by hand: the browser refuses to draw it and the page says so under the controls. If the code is only a pointing at a symbol elsewhere on the page, copy that symbol's paths instead, because the reference has nothing to point at once it leaves the page.

How do I get a high resolution PNG from an SVG?

Type the width the picture will be used at, or pick 2x or 4x to multiply it. Because the PNG is drawn from the vector at that size, the edges stay as clean at 4,000 pixels wide as at 40. For a screen, export at the displayed size, or at 2x for high density displays. For print, multiply the printed width in inches by the dots per inch: a 4 inch wide print at 300 DPI needs a width of 1,200 pixels, and the print size itself is set in the program you print from. Clear the width box and the file's own size is drawn again, shown in grey where your number was.

Why can a PNG made from an SVG come out blurry?

Because it was rasterised at one size and then stretched to another. An SVG has no pixels, so whatever turns it into a PNG has to pick a size, and a 24 by 24 icon drawn as a 24 pixel picture and then blown up to 96 pixels in a document is soft, because the pixels it needed were never drawn. Here the size is chosen before anything is drawn, the markup handed to the canvas carries that exact size, and the browser rasterises the vector at it, so the edges are as clean as they are in the SVG.

Should I choose a transparent or a white background?

Transparent, unless whatever you are pasting into cannot handle it. PNG carries an alpha channel, so transparent is the setting that keeps the clear parts of the drawing clear and lets it sit on any colour. Choose white when the destination flattens transparency onto black, which older document and slide tools sometimes do, or when you want a solid card rather than a cut-out. White paints the whole canvas first and the drawing goes over it, so nothing in the picture changes apart from what is behind it.

What is removed from the SVG before it is drawn, and why?

Six kinds of content, and each one is listed under the source box when it happens, with a count: every script element with the code inside it, every foreignObject with the markup inside it, every on-event attribute such as onclick or onload, every href or xlink:href that points anywhere but a #fragment in the same file or an embedded data: image, and every @import inside a style element, along with any url() that points outside the file. An SVG is a document that can carry code and can ask for files from other servers, and neither of those is drawing, so neither is kept. Everything else is left exactly as written, including the namespace declarations the document depends on. If a file relied on what was removed, it renders here without it, which is why the list is printed rather than hidden.

Is my file uploaded anywhere?

No. The markup is read into this tab, scanned by this page and drawn onto a canvas here, and the PNG is made from that canvas in the same tab. There is no request: no part of the file reaches a server, analytics or error reporting, and nothing about the drawing is written to your browser's storage. The tool remembers three settings between visits, the width you last set, the scale and the background, and that is all it remembers. The Start over button above forgets those.

What happens to fonts the SVG names?

Text is drawn with a font this browser already has. An SVG names a font family, it does not carry one, so the drawing uses the installed font of that name and falls back to a default when there is none, exactly as it would in a browser. A web font the file tries to fetch with @import or with a url() inside @font-face is one of the external references that is removed before drawing, so that text falls back too. If the exact lettering matters, convert the text to outlines in the editor you drew it in, then export here: outlines are drawing and they come through at any size.

How large an SVG can I convert, and how large a PNG can I get out?

Up to 1,000,000 bytes of source, which is 1 MB of markup, and up to 25,000,000 pixels in one PNG, which is about 5,000 by 5,000, with no side longer than 32,767 pixels. Those are what this machine and a browser canvas will hold rather than an upload limit, because nothing is uploaded, and going past any of them says so with the number it reached rather than quietly producing a smaller or blank file. The same is true of markup that does not parse: the message names the line the unclosed tag opened on.

Does it work on a Mac, Windows, Linux or a phone?

Yes. It runs in any current browser, Safari, Chrome, Firefox or Edge, on macOS, Windows, Linux, iPhone, iPad or Android, with nothing to install. Open SVG reads the file from wherever that device keeps its files, and Download PNG saves the picture wherever that browser saves downloads.

Can I convert several SVG files to PNG?

Yes. Choose several .svg files with Open SVG, or drop several on the stage, and each one is drawn at its own size times the scale you picked, on the background you picked, and the PNGs download together as svg-to-png.zip, named the way a single download is, such as icon-96x96.png. A file that cannot be drawn is named under the controls with the reason, and the rest are still converted. The width box is not used for a batch, because it belongs to the drawing in the source box. To give each file a width of your own, open them one at a time: the width refills from the next file's own size when it differs from the last one, and the scale and background stay as you set them.

SVG to PNG

Paste SVG code or open an .svg file, choose the output width or a 2x or 4x scale, and get a PNG drawn from the vector at exactly that size, transparent or on white, to download or copy. Choose several files and the PNGs come back together in one zip. Everything happens in this tab: the markup is read, scanned and drawn here, and no byte of it is sent anywhere. Before drawing, every script, foreignObject, on-event attribute and reference to another file is removed, and what was removed is listed under the source box.

SVG source0 bytes

Nothing to scan yet.

PNG300 by 150 px

The PNG appears here.

Width

Height

Scale

Background

Paste SVG markup into the box, or drop an .svg file on the stage, and the PNG is drawn here.

An icon at 4xviewBox 0 0 24 24, nothing typed, scale 4x
96 by 96 PNG, transparent
A logo to a fixed widthviewBox 0 0 240 120, width 1200, height empty, 1x
1200 by 600 PNG, the height from the viewBox
A file that declares no sizeno viewBox, no width, no height, 1x
300 by 150, the size a browser uses

The width box fills itself from the file: the viewBox first, then the width and height attributes, then 300 by 150, which is what a browser uses for an SVG that declares no size. Leave the height empty and it follows the width at the file's aspect ratio; type both and both are used. The scale multiplies whatever those two come to.

Several files at once. Choose or drop several .svg files and each one is drawn at its own size times the scale, on the background chosen above, and the PNGs download together as svg-to-png.zip. The first file also opens in the source box.

Common questions

How do I convert an SVG to PNG here?: Paste the SVG code into the source box, press Open SVG, or drop the .svg file on the stage, and the PNG is drawn as soon as the markup reads cleanly. Check the width, which is filled in from the file, or type the one you need, and pick 1x, 2x or 4x. Choose Transparent or White for the background. Then press Download PNG to save it, named after the file and its size, such as logo-1200x600.png, or Copy image to paste it straight into a document or chat.
Can I paste SVG code copied from a web page or an icon set?: Yes. Copy the svg element itself, from the opening <svg to the closing </svg>, and paste it into the source box. SVG written inside a web page usually leaves out the xmlns declaration that a standalone file needs, and without it a browser will not draw the markup as a picture, so the page adds it before drawing, along with the xlink declaration when the code uses xlink:href. Markup that only HTML accepts, such as an attribute with no value, still needs fixing by hand: the browser refuses to draw it and the page says so under the controls. If the code is only a <use> pointing at a symbol elsewhere on the page, copy that symbol's paths instead, because the reference has nothing to point at once it leaves the page.
How do I get a high resolution PNG from an SVG?: Type the width the picture will be used at, or pick 2x or 4x to multiply it. Because the PNG is drawn from the vector at that size, the edges stay as clean at 4,000 pixels wide as at 40. For a screen, export at the displayed size, or at 2x for high density displays. For print, multiply the printed width in inches by the dots per inch: a 4 inch wide print at 300 DPI needs a width of 1,200 pixels, and the print size itself is set in the program you print from. Clear the width box and the file's own size is drawn again, shown in grey where your number was.
Why can a PNG made from an SVG come out blurry?: Because it was rasterised at one size and then stretched to another. An SVG has no pixels, so whatever turns it into a PNG has to pick a size, and a 24 by 24 icon drawn as a 24 pixel picture and then blown up to 96 pixels in a document is soft, because the pixels it needed were never drawn. Here the size is chosen before anything is drawn, the markup handed to the canvas carries that exact size, and the browser rasterises the vector at it, so the edges are as clean as they are in the SVG.
Should I choose a transparent or a white background?: Transparent, unless whatever you are pasting into cannot handle it. PNG carries an alpha channel, so transparent is the setting that keeps the clear parts of the drawing clear and lets it sit on any colour. Choose white when the destination flattens transparency onto black, which older document and slide tools sometimes do, or when you want a solid card rather than a cut-out. White paints the whole canvas first and the drawing goes over it, so nothing in the picture changes apart from what is behind it.
What is removed from the SVG before it is drawn, and why?: Six kinds of content, and each one is listed under the source box when it happens, with a count: every script element with the code inside it, every foreignObject with the markup inside it, every on-event attribute such as onclick or onload, every href or xlink:href that points anywhere but a #fragment in the same file or an embedded data: image, and every @import inside a style element, along with any url() that points outside the file. An SVG is a document that can carry code and can ask for files from other servers, and neither of those is drawing, so neither is kept. Everything else is left exactly as written, including the namespace declarations the document depends on. If a file relied on what was removed, it renders here without it, which is why the list is printed rather than hidden.
Is my file uploaded anywhere?: No. The markup is read into this tab, scanned by this page and drawn onto a canvas here, and the PNG is made from that canvas in the same tab. There is no request: no part of the file reaches a server, analytics or error reporting, and nothing about the drawing is written to your browser's storage. The tool remembers three settings between visits, the width you last set, the scale and the background, and that is all it remembers. The Start over button above forgets those.
What happens to fonts the SVG names?: Text is drawn with a font this browser already has. An SVG names a font family, it does not carry one, so the drawing uses the installed font of that name and falls back to a default when there is none, exactly as it would in a browser. A web font the file tries to fetch with @import or with a url() inside @font-face is one of the external references that is removed before drawing, so that text falls back too. If the exact lettering matters, convert the text to outlines in the editor you drew it in, then export here: outlines are drawing and they come through at any size.
How large an SVG can I convert, and how large a PNG can I get out?: Up to 1,000,000 bytes of source, which is 1 MB of markup, and up to 25,000,000 pixels in one PNG, which is about 5,000 by 5,000, with no side longer than 32,767 pixels. Those are what this machine and a browser canvas will hold rather than an upload limit, because nothing is uploaded, and going past any of them says so with the number it reached rather than quietly producing a smaller or blank file. The same is true of markup that does not parse: the message names the line the unclosed tag opened on.
Does it work on a Mac, Windows, Linux or a phone?: Yes. It runs in any current browser, Safari, Chrome, Firefox or Edge, on macOS, Windows, Linux, iPhone, iPad or Android, with nothing to install. Open SVG reads the file from wherever that device keeps its files, and Download PNG saves the picture wherever that browser saves downloads.
Can I convert several SVG files to PNG?: Yes. Choose several .svg files with Open SVG, or drop several on the stage, and each one is drawn at its own size times the scale you picked, on the background you picked, and the PNGs download together as svg-to-png.zip, named the way a single download is, such as icon-96x96.png. A file that cannot be drawn is named under the controls with the reason, and the rest are still converted. The width box is not used for a batch, because it belongs to the drawing in the source box. To give each file a width of your own, open them one at a time: the width refills from the next file's own size when it differs from the last one, and the scale and background stay as you set them.

The PNG is drawn at exactly the pixel size you ask for, from the vector, so it is sharp at any size. It cannot use a font your browser does not have, and it deliberately drops scripts, foreignObject and every external reference before drawing, so an SVG that relies on those will render without them.