SVGs (Scalable Vector Graphics) can be scaled up or down in size without any loss of detail. Often used for logos, icons and vector based illustrations.
When to use:
Websites/Apps - ensure branding looks perfect on all screens
Illustrations - small file sizes and easily editable
Animation - SVGs can be animated
PNG
PNGs (Portable Network Graphics) are raster based images. PNGs can be saved at as hi-res images but increasing the size of a PNG will reduce the overall quality of the image. A benefit of using PNGs (instead of JPGs) is that they support transparent and semi-transparent backgrounds.
When to use:
When a SVG cannot be uploaded eg. on 3rd party apps
