Compress images in your browser

What this tool does

The tool decodes each picture, scales it down if you ask for that, and writes it again. For JPG and WebP, a lower quality gives a smaller file and removes more detail. A PNG stays a PNG but keeps at most 256 colours unless you choose otherwise, which often halves its size; with All colours it is written without any loss.

You can select as many pictures as you like and run the tool again with other settings. Each picture may have up to 50 MB and 50 megapixels.

How to use it

1. Choose the pictures, or drop them on the marked area. Each file is listed with its file size and its size in pixels.
2. Set the quality for JPG and WebP. 75 is preselected.
3. Choose the output format. Same as the original keeps JPG as JPG, PNG as PNG and WebP as WebP.
4. For PNG files, choose how many colours to keep (up to 256 is preselected) and whether to use dithering.
5. Optionally enter the longest side in pixels to scale large pictures down.
6. Start. The list shows the size before and after for every file.
7. Download single files from the list, or all of them as one ZIP archive.

How the result is produced

Your browser does the encoding. The quality from 1 to 100 is handed to the JPG or WebP encoder of the browser as a value between 0.01 and 1. Browsers build their encoders differently, so the same setting can give slightly different file sizes in different browsers.

If you enter a longest side, a larger picture is scaled so that its longer edge has exactly that many pixels; the other edge follows from the proportions and is rounded to a whole pixel. Smaller pictures keep their size.

Only the pixels are written. Information that a camera stored in the original, such as the camera model, the time or the GPS position, is not copied into the result. Some browsers add a short technical header of their own with the pixel size and the colour space.

If the new file has the same format and pixel size as the original but is not smaller, you get the original file back unchanged, including its metadata. The list says so for each file this applies to.

How PNG files are made smaller

A PNG can store a palette of up to 256 colours and, for each pixel, only the number of its colour in the palette (colour type 3 in the PNG specification). That needs one byte per pixel instead of three or four, and the compression inside PNG works better on it.

• The tool first counts the colours. If the picture has no more colours than you allow, all of them go into the palette and the result is lossless; the list then says "all colours kept".
• Otherwise the median cut method (Heckbert, 1982) groups the colours: the group with the largest spread is split in two at the middle of its widest colour channel, until there are as many groups as allowed colours. Each group becomes one palette colour, its average, and two rounds of k-means move the colours to the centre of the pixels closest to them.
• Each pixel gets the nearest palette colour. With dithering, the difference is passed on to the neighbouring pixels (Floyd–Steinberg: 7/16 to the right, 3/16, 5/16 and 1/16 to the row below), so that gradients look smooth instead of banded.
• Transparent pixels stay transparent, and half-transparent ones keep their opacity through the tRNS chunk of the PNG.

The colour reduction is code written for this site, not an outside library. The PNG data itself is compressed by the browser.

Worked example

A phone photo of 4032 × 3024 pixels should be sent by email. With the longest side set to 1600, the longer edge becomes 1600 pixels. The factor is 1600 ÷ 4032 ≈ 0.397, so the shorter edge becomes 3024 × 0.397 = 1200 pixels.

The result has 1600 × 1200 = 1.92 million pixels instead of 12.19 million, which is about one sixth. How many bytes that saves depends on the picture, because fine detail such as grass or fabric needs more data than a clear sky. The list shows the real sizes, so you can try a setting and compare.

For PNG, a screenshot of a page of this site, 1280 × 800 pixels and 74,197 bytes, was compressed in Chrome. It has more than 256 colours because of the smoothed text edges.

Even at 32 colours the text stayed clean. A camera photo saved as PNG (3000 × 2002 pixels, 8,389,053 bytes) became 3,567,100 bytes at 256 colours with dithering; as a JPG at quality 90 it would have been 1,375,148 bytes, so photos are better converted to JPG or WebP.

Choosing a quality

These are starting points, not rules. Look at the result at full size before you delete an original.

Common mistakes

• Compressing the same JPG again and again. Every lossy save removes detail. Keep the original and always start from it.
• Choosing All colours and expecting a much smaller PNG. Written again without loss, a PNG seldom gets smaller; the tool then keeps the original.
• Reducing a photo saved as PNG to 256 colours instead of converting it. As the example shows, JPG or WebP makes a photo far smaller and shows no dither dots.
• Turning dithering off for pictures with gradients, such as skies. With few colours the gradient breaks into visible bands.
• Converting a picture with transparent areas to JPG. JPG cannot store transparency; transparent areas become white. Keep PNG or choose WebP.
• Choosing quality 100 to be safe. The file can become larger than the original without looking better.