Image formats, dimensions and quality — explained

Updated 25 September 2026

Three independent things decide how an image looks and how big the file is: its format, its pixel dimensions and, for lossy formats, its quality setting.

Format

  • JPG — photos. Small, universally supported, no transparency. Every re-save loses a little quality.
  • PNG — screenshots, logos, text, anything with flat colour or transparency. Lossless, but large for photos.
  • WebP — both jobs, 25–35% smaller than JPG at similar quality, with transparency. Safe for the web today.
  • AVIF — smaller again; not yet accepted by every app or upload form, and browsers can't create it themselves yet.

Converting doesn't add quality: a JPG saved as PNG keeps its JPEG artefacts and gets bigger. Use the image converter to go towards smaller formats, not to "repair" images.

Dimensions (pixels) and DPI

Pixel dimensions are what matter on screens: a 1920-pixel-wide image fills a laptop screen; a 4000-pixel phone photo is mostly wasted bytes on a website. DPI (dots per inch) only matters when printing: it says how many pixels go into each inch of paper. For a sharp print at 300 DPI, a 10×15 cm photo needs about 1200×1800 pixels. Changing the DPI number in a file's metadata without changing the pixels does nothing to quality.

UseLong side
Email attachment, chat1280–1920 px
Website hero image1920–2560 px
Thumbnail, avatar200–400 px
A4 print at 300 DPI3508 px

Reducing resolution is the single most effective way to shrink photos. Increasing it can meet a minimum size requirement and look smoother than naive scaling, but it can't create detail that wasn't captured.

Quality settings

For JPG and WebP, quality 80–85 is visually indistinguishable from the original for most photos at a fraction of the size. Below about 60, you'll see blockiness in skies and gradients. Screenshots with text look better as PNG or lossless WebP than as a low-quality JPG.

Crop before you resize

If a platform wants a specific shape (1:1, 16:9, 4:5), crop to that ratio first, then resize. Resizing to a different shape stretches the image instead.

More guides