Image Compressor

Why Image File Size Matters More Than You Think

A photograph that looks fine on your phone can silently wreck a website. Most smartphone cameras now produce JPEG files between 3 MB and 8 MB per shot. Upload those directly to a page and visitors on average connections wait several seconds for images to load — long enough that a meaningful share of them leave before seeing the content at all. Google’s PageSpeed tools flag oversized images as one of the most common and impactful performance issues on the web, and slow page speed directly affects both user experience and search ranking.

Image compression reduces file size by discarding data that the human eye is unlikely to notice. At a quality setting of 80%, a typical JPEG loses almost nothing visible while shrinking to 20–30% of its original size. At 60%, savings are even greater and images still look sharp in most web contexts. The right setting depends on the image content and where it will be used.

How JPEG Compression Works

JPEG compression operates by dividing an image into small 8×8 pixel blocks and applying a mathematical transform (the Discrete Cosine Transform) to each block. This converts the pixel data from color values into frequency components — separating the broad color gradients (low frequencies) from the fine texture details (high frequencies). The compression algorithm then discards the high-frequency detail, which the eye is less sensitive to, and keeps the broad structure.

The quality setting controls how aggressively high-frequency detail is discarded. At quality 100, almost nothing is thrown away and the file is large. At quality 1, nearly all detail is discarded and the file becomes tiny but visually broken. The sweet spot for most web images is 70–85: files are 5–10× smaller than the original while looking virtually identical at normal viewing distances and screen sizes.

This is why JPEG is lossy: each save at below 100% quality permanently discards some information. This tool compresses your original file, so the original on your device is untouched. Always keep your original and only serve the compressed version.

Choosing the Right Quality Setting

There is no universally correct quality number. The right choice depends on the image content and its intended use.

Photography with fine detail and smooth gradients (landscapes, portraits, food photography) tends to compress well at 75–85%. These images have lots of fine texture that JPEG preserves effectively at high quality settings, and the artifacts that appear at lower settings show up as smearing in textured areas like hair, foliage, and fabric.

Images with large flat color areas (product shots on white backgrounds, illustrated graphics, screenshots with text) compress more aggressively without obvious quality loss. Settings of 60–75% often produce files that look identical to the original at typical screen sizes.

Thumbnails and small preview images that will be displayed at 100–300px wide can usually be compressed to 50–65% because the reduced display size masks compression artifacts. What looks blocky at full size is invisible at thumbnail dimensions.

Hero images and full-width banners on websites warrant more care because compression artifacts are more visible at large display sizes. Start at 80% and only go lower if the file size savings justify the quality trade-off for your specific image.

JPEG vs. PNG: Which Format to Compress

This tool compresses JPEG images. PNG is a different format that uses lossless compression — every pixel value is stored exactly, which makes PNG files larger than JPEG for photographs but lossless, meaning no quality degradation no matter how many times you save.

PNG is the right choice for images with transparency, for screenshots and interface graphics with sharp edges and text, and for any image that needs to be edited and re-saved repeatedly. JPEG is better for photographs and realistic imagery where the 5–10× file size advantage over PNG matters and the lossy compression is not detectable at reasonable quality settings.

Converting a PNG to JPEG to compress it is a common workflow, but be aware that flat-color graphics and text-heavy images often look worse as JPEGs than as PNGs, even at high quality settings, because JPEG’s block-based compression introduces artifacts around sharp edges.

Web Performance: What File Sizes to Target

As a practical guide for web use: hero images and full-width banners should ideally be under 200 KB. Product images in a grid should be under 100 KB each. Thumbnail images should be under 30 KB. Blog post inline images should generally be under 150 KB.

These are starting points, not hard rules. A single hero image at 250 KB on an otherwise lightweight page loads faster than five product images at 80 KB each, because the total page weight is what matters for load time. Compress everything, compare the totals, and test actual load times with browser developer tools or PageSpeed Insights to see real-world impact.

Your Images Never Leave Your Browser

The entire compression process runs in your browser using the HTML5 Canvas API. Your image is read from your local file system, processed in memory, and the compressed output is made available for download — all without any data being sent to a server. This matters for images containing personal information, confidential documents, proprietary product photography, or anything else you would not want passing through a third-party service. Close the tab and nothing remains.