Transparency
How to Make a Transparent PNG from SVG
Transparent PNG files are useful when an image must sit naturally on different backgrounds. Logos, icons, badges, stickers, watermarks, and UI overlays often need transparent pixels around the artwork. SVG is a strong source format for this because vector edges can be rasterized cleanly at the export size you choose.
Export to PNG, not JPG
PNG supports an alpha channel, which stores transparent and semi-transparent pixels. JPG does not. If you export a transparent SVG as JPG, the transparent area will be filled with a solid color, usually white. That may be acceptable for some documents, but it is not a transparent image.
Keep the canvas background empty
When converting SVG to PNG, the canvas should not be filled before drawing the SVG. If the converter paints white, black, or another color behind the artwork, the exported PNG will no longer be transparent. Choose the transparent background option when you want the alpha channel preserved.
Check for hidden rectangles
Sometimes an SVG appears transparent but actually contains a white rectangle behind the artwork. That rectangle is part of the SVG itself, so a converter will faithfully include it. If your exported PNG has a white box, inspect the SVG source or open it in a vector editor and look for background shapes.
Use enough resolution for clean edges
Thin strokes and diagonal edges can look rough if the export size is too small. Export at 2x or 3x when the image will be displayed on high-density screens. Then use the image at the intended CSS or layout size. This gives edges more pixels to work with while keeping the visual size controlled.
Preview on multiple backgrounds
A transparent PNG should look good on both light and dark surfaces. After export, test it on white, black, and the actual background where it will be used. This helps reveal unwanted halos, leftover backgrounds, or low-contrast edges.