Tools

Image resizer: by dimensions or by target file size

Two ways to resize: give exact pixel dimensions, or give a target file size and let the tool search for the settings that land under it.

Drop an image here or tap to choose JPG, PNG, WebP

Everything on this page runs inside your browser using the Canvas and File APIs. Your files are never uploaded, never stored on a server, and never seen by us.

How to use this image resizer

There are two completely different reasons to resize an image, and they need different tools. One is "make it exactly 1200 pixels wide because that is my content column". The other is "make it smaller than 200 KB because the upload form will not take anything larger". This page does both, and the second one is the reason it exists — most resizers only do the first.

Mode 1 — resize by pixel dimensions

Type a width and the height fills in automatically to preserve the aspect ratio. Untick "keep aspect ratio" if you deliberately want to stretch or squash the image, though you will almost never want that. The resample uses the browser's high-quality smoothing path, which handles downscaling cleanly; upscaling beyond the original dimensions is possible but will look soft, because there is no extra detail to invent.

Useful reference numbers: 1920 px for a full-bleed hero image, 1200 px for images inside an article, 800 px for a two-column layout, 400 px for a card thumbnail, 150 px for an avatar. If the image will be shown on a high-density display and needs to stay crisp, double the number and let CSS scale it down.

Mode 2 — resize by percentage

The quickest option when you do not care about exact numbers, only about "roughly half the size". This is the mode to use for a batch of photos of mixed dimensions, where a fixed pixel width would crop-lock some of them into odd shapes.

Mode 3 — resize to a target file size

This is the one that solves real-world problems. Passport photo uploads capped at 100 KB. University application portals that reject anything over 500 KB. Forum avatars limited to 50 KB. Email attachment policies. You enter the ceiling in kilobytes and the tool searches for a combination of quality and dimensions that lands underneath it.

The search is deliberate about its order. It first tries the full resolution and lowers the encoder quality step by step. Only when quality alone cannot reach the target does it start reducing dimensions, and then it works through progressively smaller scales, re-testing quality at each one. That order matters: a slightly soft image at full size is almost always more useful than a razor-sharp thumbnail. Because each attempt is a real encode, the reported size is the actual byte count of the file you download, not an estimate.

If your target is very aggressive — say 20 KB for a detailed photograph — the tool will still produce a file, but it will be small and visibly compressed. There is no way around that; it is physics, not a tool limitation. Give it as much headroom as the form allows.

Choosing the right output format for a size target

WebP is the default for target-size mode because it reaches any given byte budget at noticeably better quality than JPEG. Switch to JPEG if the destination system specifically requires it — many government and institutional upload forms do, and they will reject a .webp file even though it is smaller.

Why resizing matters more than compressing

File size scales roughly with pixel count, which scales with the square of the dimensions. Halving an image's width and height leaves you with a quarter of the pixels, and typically somewhere between a quarter and a third of the bytes. No quality setting produces a saving of that magnitude without making the image look broken.

This is why the single most effective performance fix on most websites is not a better compressor — it is serving images at the size they are actually displayed. If a browser downloads a 3000-pixel-wide photo to render it 600 pixels wide, 96% of the downloaded pixels are discarded before anything appears on screen. On a mobile connection that is several seconds of wasted loading time and a directly measurable hit to your Largest Contentful Paint score.

Practical workflow

Resize first, compress second. Set the dimensions to what the page actually needs, then run the result through the image compressor to trim the remaining bytes. Doing it in the opposite order wastes effort, because resizing after compressing re-encodes an already-degraded image and compounds the artefacts.

Frequently asked questions

How do I resize an image to exactly 200 KB?

Choose "By target file size" mode, enter 200, and pick a format. The tool encodes the image repeatedly with progressively lower quality — and then progressively smaller dimensions — until the result fits under 200 KB. The size shown is the real byte count of the downloadable file.

Will resizing make my image blurry?

Downscaling is generally clean: the browser averages neighbouring pixels, and the result looks sharp at the new size. Upscaling is the problem — enlarging a 400 px image to 1600 px cannot invent detail that was never captured, so it will always look soft. Start from the largest original you have.

Does the tool keep the aspect ratio?

Yes by default. Typing a width fills in the matching height automatically. You can untick the box to set both independently, but distorting the ratio is rarely what you want — crop instead if you need a different shape.

Can I resize several images at once here?

This page handles one image at a time so it can show you an accurate preview and exact numbers. For batches, use the image compressor, which accepts multiple files and has a "cap the longest side" field that resizes every image in the batch.

What is the best image size for a website?

Match the display size: 1920 px wide for full-width hero images, 1200 px for in-article images, 400 px for thumbnails. Then aim to keep each file under about 200 KB. Anything larger starts costing you measurable load time on mobile connections.