SVG vs PNG: Which Should You Use for Logos and Icons?
Both formats support transparency and both are good for logos. The difference is how they store the picture, and that changes where each works best.
Vector versus bitmap
An SVG stores shapes and curves as instructions, so it can be scaled to any size without getting blurry and is often tiny. A PNG stores a fixed grid of colored pixels. Enlarge it and it turns soft and blocky.
Use SVG when
The artwork is a logo, icon, chart or simple illustration shown on a website. SVG stays sharp on every screen density and can be styled with CSS.
Use PNG when
You need to put the picture somewhere that does not accept SVG: email signatures, many social networks, slide decks, marketplaces and app stores. PNG is also the right choice for screenshots and for any image with photographic detail.
Converting SVG to PNG well
Pick the output size you need and render at 2x or more for retina screens. For print, aim for the pixel size that gives at least 300 pixels per inch at the printed size.