Image 1
Best for images with sharp lines and areas of solid color, like graphs, screenshots, and logos. It is lossless, meaning it retains perfect quality.
Image 2
Is the best format for photographs and images with complex color gradients. It uses lossy compression, wich significantly reduces size while maintaining good perceived quality, making web pages load faster.
Image 3
Like the image 2, this is a photograph with many colors, complex textures, and smooth color transitions. JPEG's efficient lossy compression is ideal for this type of image on the web.
Image 4
This image has sharpe lines, solid colors, and appears to require a transparent background. PNG supports high-quality transparency. SVG is also excellent as it is simple vector graphic that will scale perfectly and have a tiny file size.
Image 5
This is a graphic with a sharp text solid colors, and likely needs a transparent background. PNG is suitable for lossless quality and transparency. SVG is the most highly recommended for simple geometric logos, icons, and signs like this, offering superior scalability and the smallest file size.