Resize an image

Shrinking is safe, enlarging is not

These two operations look symmetrical and are not. When you shrink an image, every pixel in the result is an average of several real pixels from the original — there is more information available than the output needs, and the only question is whether the tool uses it properly. This one reduces through repeated halving rather than a single large jump, because one big draw samples far too few of the source pixels and produces the jagged, shimmering edges that make a reduced photo look cheap.

Enlarging has no such luxury. The detail is not there to recover, so every added pixel is interpolated from its neighbours, and the result is inevitably softer than the original was at its own size. It is sometimes the right call — a logo that needs to fill a header, an image being printed small — but it is never free, which is why the enlarging switch is off until you turn it on rather than something you trip over by typing a big number.

Proportions, and when to break them

With keep proportions on, filling in one dimension derives the other from the original's aspect ratio, and filling in both fits the image inside the pair — it touches whichever bound is tighter and leaves slack against the other. That is almost always what you want, and the dimensions row names the bound that did the limiting so a number that appears to have been ignored can be seen doing nothing instead.

Turning it off makes both numbers literal, stretching the image to match. This distorts faces and circles immediately and obviously, so it is worth reserving for the cases that genuinely call for it: a background texture, a banner slot with a fixed shape, or an image that was stored squashed and needs correcting back.

Picking a size

• Full-width photo — 1920px on the long edge. Larger sends pixels that no ordinary screen will display.
• Article or content column — 800 to 1200px, depending on how wide your layout runs.
• Thumbnail or avatar — 300 to 400px is plenty.
• Email — 600px wide is the traditional safe maximum, and many clients still assume it.

Phones complicate this. A high-density screen packs two or three physical pixels into every CSS pixel, so an image displayed in a 400px-wide slot on a modern phone wants around 800 real pixels to look sharp. Doubling your intended display size is a reasonable default, and going beyond triple is wasted bandwidth.

What resizing removes

The image is decoded, redrawn onto a canvas, and re-encoded, which means everything that was not pixel data is discarded: camera and lens information, exposure settings, capture timestamps, and — the one that matters most — any GPS coordinates the camera embedded. If you are about to post a photo taken at home, that is a privacy win worth having. If you were relying on the capture date to sort your archive, keep the original.

Wanting a smaller file rather than smaller dimensions? The compressor holds the size and squeezes the bytes. Changing format is on the converter, and the favicon page handles the specific sizes a site icon needs.

Common questions

Will resizing make my image blurry?

Shrinking, no — done properly it is close to lossless in appearance. This page reduces through repeated halving rather than one large jump, which averages every source pixel into the result; a single big draw skips most of them and produces the jagged, sparkly edges that make a reduced image look cheap. Enlarging is the opposite story. There are no extra details to recover, so an upscale invents pixels by interpolating between the ones you have, and the result is always softer than the original at the same size. That is why enlarging is off until you switch it on.

How do I resize to an exact width and height?

Enter both, then turn off "keep proportions". With proportions locked, giving both numbers fits the image inside them — it touches one bound and leaves slack against the other, so nothing is distorted. Unlocked, both numbers are obeyed literally and the image stretches to match, which is occasionally what you want for a banner or a fixed-size slot and is usually not. The dimensions row tells you which of the two bounds actually constrained the result, so a number that looks ignored can be seen doing nothing rather than being silently dropped.

Why is my resized file bigger than the original?

Usually because the original was a heavily compressed JPEG and the output is PNG, which is lossless and stores every pixel exactly. Re-encoding a photo as PNG routinely multiplies the file size several times over even at a smaller pixel count. Switch the output format to JPEG or WebP and the size will drop below the original. It can also happen when you enlarge, since more pixels means more data no matter how efficient the format is.

Does resizing strip EXIF data?

Yes, and that is worth knowing in both directions. Because the image is redrawn onto a canvas and re-encoded, everything that was not pixels — camera model, lens settings, timestamps, and GPS coordinates — is gone from the output. That is a privacy benefit if you are about to post a photo taken at home, and a real loss if you were relying on the capture date. Keep the original if the metadata matters.

What size should I use for a web page?

For a full-width photograph, 1920px on the long edge is the usual ceiling — beyond that you are sending pixels no ordinary screen will show. A content-column image is typically 800–1200px, a thumbnail 300–400px. The one thing worth accounting for is that phones have high-density screens, so an image displayed at 400 CSS pixels on a modern phone wants roughly 800 real pixels to look sharp. Halving your display size and doubling it back is a reasonable rule.

Is my image uploaded anywhere?

No. Decoding, resizing, and re-encoding all happen in your browser using canvas, and the file never leaves your device. Nothing is sent to a server, nothing is stored, and the page keeps working with the network disconnected once it has loaded.