Image Resizer

Resize to the size you actually display

The most common performance problem on a website is a 4000 pixel wide photograph displayed in a 400 pixel wide container. The browser downloads every byte and then throws most of the detail away. Resizing to roughly the displayed size, or twice it for high-density screens, routinely removes 80 to 95 percent of the file size with no visible difference.

Downscaling is safe, upscaling is not

Reducing dimensions discards information and produces a clean result. Enlarging invents pixels that were never captured, and conventional interpolation can only blur or introduce artefacts. Machine-learning upscalers hallucinate plausible detail, which is fine for a decorative image and not fine for anything where accuracy matters. Always start from the largest original you have.

Format choice

WebP is supported everywhere now and is typically 25 to 35 percent smaller than JPEG at equivalent quality, with alpha transparency. AVIF compresses better still, often half the size of JPEG, at the cost of slower encoding. JPEG remains the safe universal fallback for photographs. PNG is for images needing lossless quality or sharp-edged graphics such as screenshots and logos; using PNG for a photograph produces a file several times larger than necessary. SVG is the right answer for icons and logos, since it scales to any size from one small file.

Quality settings

JPEG and WebP quality around 80 is the usual sweet spot: the difference from 100 is invisible in normal viewing while the file is a fraction of the size. Above 90 the returns are negligible and the file grows sharply. Re-encoding an already lossy image compounds the loss, so always resize from the original rather than from a previously exported copy.

Always set width and height

Specifying intrinsic dimensions in the markup lets the browser reserve the correct space before the image loads, which prevents the layout shifting as it arrives. Cumulative Layout Shift is a Core Web Vitals metric, and unsized images are its most frequent cause.

Processed locally

Resizing uses the browser canvas. Files never leave your device, which matters for photographs containing people, documents or anything client-confidential. Note that canvas processing also strips EXIF metadata, including GPS coordinates, which is usually desirable before publishing.