Skip to main content
ToolsHub
Image 6 min read

Image Formats Explained: JPG, PNG, WebP, HEIC, and SVG

Choosing the wrong format means either bloated files that slow down your site or washed-out images that miss the mark. Here is what each format is actually for.

The quick answer

  • JPG — Photos and anything with gradients. Small file size, some quality loss.
  • PNG — Screenshots, logos, anything needing transparency. Lossless, larger files.
  • WebP — Web images where you want the best of both worlds. Smaller than JPG and PNG, supported by all modern browsers.
  • HEIC — iPhone and iPad photos. Excellent compression, poor compatibility outside Apple.
  • SVG — Icons, logos, illustrations. Resolution-independent vector format; not for photos.

JPG (JPEG) — the everyday photo format

JPG uses lossy compression: it discards information that the human eye is unlikely to notice — sharp edges around smooth areas, for example — to achieve dramatically smaller file sizes. A typical 5 MB RAW photo might become a 300 KB JPG at quality 85 without visible degradation.

The trade-off is that every re-save at a lower quality setting accumulates loss. If you are editing an image, work in a lossless format (PNG, TIFF) and export JPG only at the end of your workflow.

Use JPG for: Photos, product images, social media posts, email attachments.

Avoid JPG for: Screenshots with text (blocky artifacts around letters), logos, anything that will be edited again.

PNG — the precision format

PNG uses lossless compression: every pixel is stored exactly. A PNG opened, edited, and saved again is pixel-perfect. It also supports an alpha channel (transparency), which JPG does not.

The cost is file size: a photograph stored as PNG can be 3–5× larger than the same image as JPG at 90% quality. For photos on a website, that extra weight usually is not worth it.

Use PNG for: UI screenshots, icons, logos with transparent backgrounds, infographics with text, images that will be edited further.

Avoid PNG for: Full-size photographs on websites where page speed matters.

WebP — the modern web default

Developed by Google, WebP supports both lossy and lossless compression, alpha transparency, and animation. It consistently produces files 25–35% smaller than comparable JPGs or PNGs, with equivalent visual quality.

Browser support is now universal: Chrome, Firefox, Safari (since 2020), and Edge all handle WebP natively. The main reason to not use it is tool compatibility — some desktop applications, especially older versions of Photoshop, do not open WebP files by default.

Use WebP for: Everything on the web that you currently use JPG or PNG for.

Avoid WebP for: Files that must be opened in legacy software or sent to people using non-web tools.

HEIC — the iPhone format you might not want

HEIC (High Efficiency Image Container) is Apple's default photo format since iOS 11. It uses the HEVC (H.265) codec to store photos at half the file size of JPG with equivalent or better quality. A burst of 10 iPhone photos might be 15 MB as HEIC but 30 MB as JPG.

The problem is compatibility. Windows cannot open HEIC files without installing a codec. Android phones do not support it. Many web platforms and apps reject HEIC uploads. If you need to share photos broadly, convert to JPG first.

Use HEIC for: Keeping photos on your Apple devices where storage is limited.

Convert to JPG when: Uploading to social platforms, sharing with non-Apple users, or submitting to any web service.

Use the HEIC to JPG converter — it runs entirely in your browser, no upload required.

SVG — the format that never blurs

SVG (Scalable Vector Graphics) is not a raster format at all — it describes shapes, paths, and text in XML. An SVG logo looks identical at 16px and 4000px because it is re-drawn at render time, not stored as pixels. SVG files are also CSS-stylable and scriptable.

SVG is wrong for photographs. A complex photo converted to SVG is enormous and looks like clip art. It is right for anything drawn with geometric shapes: icons, diagrams, charts, and logos.

When you need a raster version of an SVG — for platforms that do not support vector uploads — use the SVG to PNG converter.

Conversion tools on ToolsHub

  • PNG to JPG — convert lossless screenshots to smaller JPGs
  • JPG to PNG — convert photos to lossless for further editing
  • Convert to WebP — optimise any image for the web
  • HEIC to JPG — make iPhone photos universally compatible
  • SVG to PNG — rasterize vector graphics at any resolution

Need to convert an image right now?

Browse image tools →