Image formats explained: JPG, PNG, WebP, AVIF, GIF, BMP and ICO
Which format to use for photos, logos, screenshots, web pages, print and social, and why.
Every image format is a set of trade-offs between file size, quality, transparency, animation and compatibility. Pick the wrong one and you either get a bloated file or a blurry logo. This guide sets out what each format is good at, with the numbers you need to decide.
The two kinds of compression
Lossless compression stores every pixel exactly and simply finds a more efficient way to write the same data, the way a ZIP does. Open and save a lossless image a thousand times and it is unchanged. PNG, BMP, GIF and lossless WebP work this way.
Lossy compression throws information away, targeting the detail the human eye is least sensitive to: fine texture, subtle colour differences, high-frequency noise. The result can be a tenth of the size of a lossless file with no visible difference, but each re-save loses a little more. JPG, lossy WebP and AVIF work this way.
Rule one follows directly: use lossy formats for photographs, which are full of noise and texture nobody misses, and lossless formats for graphics with sharp edges, flat colours and text, where every pixel matters.
Format by format
JPG (JPEG)
The photo format since 1992. Lossy, 8-bit colour, no transparency, no animation. Supported by everything ever made. A quality setting from 0 to 100 controls the trade-off; 80 to 85 is the everyday sweet spot. Its weaknesses are visible "blocking" at low quality, ringing around sharp edges, and the lack of transparency. Use it for photos going anywhere outside a browser: email, print, marketplaces, older software.
PNG
Lossless, up to 16-bit colour, full alpha transparency, no animation (APNG exists but is rare). The right choice for logos, icons, screenshots, diagrams, charts and any image that needs a transparent background. Its weakness is size: a PNG photograph can be ten times the size of a JPG. Never use PNG for photographs on a website.
WebP
Google's web format, now supported by every current browser. Has both lossy and lossless modes, supports transparency in both, and supports animation. Lossy WebP is about 25 to 35% smaller than JPG at equal quality; lossless WebP is about 25% smaller than PNG. It is the best general-purpose format for anything displayed in a browser. Its weakness is compatibility outside the browser: older desktop software, some email clients and many upload forms still reject it.
AVIF
Newer still, based on the AV1 video codec. Typically 50% smaller than JPG and 20% smaller than WebP at equal quality, with transparency, animation and wide colour support. Supported by all current browsers since 2024. Encoding is slow, especially in the browser, and support in non-browser software is still patchy. Use it when file size is critical and you control the display environment; serve a WebP or JPG fallback alongside.
GIF
From 1987. Limited to 256 colours per frame, single-colour transparency, and animation, which is the only reason it is still everywhere. Terrible for photographs, fine for simple graphics, unbeatable for compatibility. For still images, PNG does everything GIF does but better; for animation, MP4 or animated WebP are far smaller.
BMP
Uncompressed Windows bitmap. Enormous files, no transparency in common use, no compression. Survives only because it is trivially simple to read, which matters to embedded devices and legacy software. Never use it for the web or for storage.
ICO
The Windows icon and browser favicon format. Contains several sizes of the same image in one file so that the right one can be chosen for a tab, a bookmark or a desktop shortcut. Made from a PNG using the PNG to ICO tool.
Comparison table
| Format | Compression | Transparency | Animation | Photo size vs JPG | Compatibility |
|---|---|---|---|---|---|
| JPG | Lossy | No | No | 1× | Universal |
| PNG | Lossless | Yes, full alpha | No | 5 to 10× | Universal |
| WebP | Both | Yes, full alpha | Yes | 0.65 to 0.75× | All browsers, most modern apps |
| AVIF | Both | Yes, full alpha | Yes | 0.5× | All current browsers, few apps |
| GIF | Lossless, 256 colours | Yes, on/off | Yes | 2 to 4× (and worse quality) | Universal |
| BMP | None | No | No | 20 to 30× | Universal but rarely used |
Which format for which job
- Photos on a website: WebP at quality 75 to 85, with a JPG fallback if you must support very old browsers. AVIF if you want the smallest possible pages.
- Logos and icons on a website: SVG if you have it; otherwise PNG or lossless WebP.
- Screenshots: PNG. Lossy compression blurs text.
- Email attachments: JPG for photos, PNG for graphics. Do not send WebP; too many mail clients mishandle it.
- Print: JPG at quality 95 or PNG/TIFF, at 300 pixels per inch of the printed size.
- Social media: JPG or PNG; every platform recompresses on upload anyway, so upload at high quality and the right dimensions.
- Transparent product cut-outs: PNG for maximum compatibility, WebP for the web.
- Favicons: ICO plus a PNG for mobile home screens.
Converting between them
Every conversion on this site runs in your browser. The most common routes are PNG to WebP and JPG to WebP for the web, WebP to JPG and WebP to PNG for compatibility, and PNG to JPG for shrinking photos that were exported in the wrong format. The image compressor handles any of them with batch support.