Skip to content

Image Resizer

Drop one or more images or click to browse

Pick multiple files to get per-file downloads or a zip.

Estimates for educational purposes — not financial, medical, or legal advice. See terms.

Resizing is the most common image operation outside of compression. Web pages need responsive sizes; profile photos need square crops; thumbnails need tight bounding boxes. This tool runs entirely in your browser via Canvas — drop files, set dimensions, download. Multi-file workflows produce a zip.

How resizing works

The image is decoded with createImageBitmap() into a bitmap, drawn onto a canvas at target dimensions with imageSmoothingEnabled: true and imageSmoothingQuality: 'high' (browser-implementation Lanczos / similar), then re-encoded with canvas.toBlob in the source format at quality 92.

The resampling filter matters more than people realise. Chromium’s high-quality mode uses a Lanczos filter, which preserves edges better than the default bilinear. Firefox and Safari use similar high-quality filters when explicitly requested. Without imageSmoothingQuality: 'high', you’d get the default bilinear filter — fine for small downscales, fuzzy for big ones.

Three resize modes

Pixels mode sets explicit width × height. Good for fixed-size outputs (200×200 avatar, 1200×600 banner). Aspect-lock derives the second dimension from the first, preserving source ratio.

Percentage mode scales both dimensions by the same factor (50% = half-size, 200% = double-size). Aspect always preserved.

Fit-within mode scales to fit inside a max-width × max-height box, preserving aspect ratio. Never enlarges — if the source is already smaller than the box, it stays unchanged. The most useful mode for “make sure no dimension exceeds X” workflows.

Example: thumbnail batch

A folder of 20 product photos, each 4032×3024 from a phone camera (~3 MB each, 60 MB total). Drop them all, fit-within mode, max 800×800. Result: 20 thumbnails averaging 80 KB each in a 1.6 MB zip — 30× total reduction.

Example: avatar from a portrait

A 1200×1600 portrait, want a 200×200 square avatar. Pixels mode, 200×200, aspect lock OFF (since you’re explicitly squashing). Get a 200×200 image with the subject’s proportions stretched. To preserve aspect, you’d need to crop first — see the image cropper for that.

Example: making a banner half-size

A 2400×800 banner, want 1200×400 for mobile. Percentage mode, 50%. Done.

When to combine with other tools

  • Need a different format too? Resize first, then run through the format converter.
  • Want to compress as well? Resize first, then through the compressor — combined output is much smaller.
  • Need square crops with subject preservation? Use the cropper before the resizer.

Common mistakes

Pixels mode on mixed-size batches. Stretches portraits and squashes landscapes. Use fit-within for mixed-aspect input.

Trying to upscale dramatically. Bilinear / Lanczos resampling can’t invent detail. A 200×200 input upscaled to 1000×1000 looks blurry no matter the filter. For real upscaling, use an AI upscaler (super-resolution).

Forgetting aspect lock for pixels mode. Without it, changing width doesn’t change height — and vice versa — so you end up with stretched images. Lock is on by default.

Resizing PNG screenshots to JPEG dimensions. The output stays PNG (since source was PNG). If you wanted JPEG, change format separately.

What this tool does not do

It doesn’t change format. Output stays in the source’s format. Use the image format converter to switch.

It doesn’t crop. To select a region of the source, use the image cropper first, then resize the crop.

It doesn’t rotate. EXIF orientation flags are respected by createImageBitmap automatically; manual rotation isn’t supported here.

It doesn’t batch-tag with custom names. Output filenames follow <original>-WxH.<ext>. For custom naming patterns, scripting is your friend.

It doesn’t upload anywhere. Resize and zip both run client-side.

Frequently asked questions

What's the difference between the three modes?

**Pixels** sets explicit width × height — useful when you need a specific size (avatar at 200×200, banner at 1200×400). With aspect lock on, changing one dimension auto-adjusts the other; with it off, the image is stretched if dimensions don't match the source ratio. **Percentage** scales both dimensions by the same factor, preserving aspect ratio always — pick this when you want 'half size' or 'twice as big'. **Fit-within** preserves aspect ratio and scales to fit *inside* a bounding box — the most common case for 'no dimension exceeds 1600px' workflows. Fit-within never enlarges (a 400×300 image stays 400×300 even if max is 1600×1600).

How do batch resizes work?

Drop multiple files at once (or click and multi-select). The tool resizes each independently and bundles the outputs into a single zip via JSZip. The zip uses STORE compression (no zlib) since the contents are already compressed images — adding zlib on top would just slow down generation without saving meaningful bytes. Filenames inside the zip follow the same `<original>-WxH.<ext>` pattern as single-file output.

Why does pixels mode warn about multiple files?

Because in pixels mode every image is resized to *exactly* the specified dimensions. If you batch-resize a portrait JPEG and a landscape JPEG to 800×600, the portrait gets stretched and the landscape gets squashed — both end up 800×600, neither preserves aspect. For mixed-size sources, fit-within is almost always what you want: each image preserves its own aspect ratio while none exceeds the bounding box.

What happens to image quality during resize?

The browser's Canvas resampling does a decent job — `imageSmoothingQuality: 'high'` enables a Lanczos-style filter on Chromium and a similar high-quality filter on Firefox / Safari. Downscaling looks good as long as you're not going to extreme sizes (4000px → 50px in one step can produce moiré on fine textures; for severe downscales, multi-step resampling is better but slower). Upscaling is bilinear-ish — can never invent detail that wasn't there. For best upscale quality, use a dedicated AI upscaler (super-resolution); for routine downscale, this is fine.

Does resizing change file format or just dimensions?

Just dimensions. The output is re-encoded in the *source* format (JPEG → JPEG, PNG → PNG, WebP → WebP). Quality is fixed at 92 (a sensible default). To change format, run the result through the format converter; to compress further, run it through the compressor. Each tool does one job — chain them for a full pipeline.