Image Resizer
Resize a photo in the browser, with a stepped downscale that keeps detail, and nothing uploaded anywhere.
This tool needs JavaScript: the resizing happens in your browser, which is also why nothing is uploaded.
Fit inside keeps the proportions and stays within the box. Cover fills the box and crops the overflow. Exact stretches, which is rarely what you want.
Used by the percent mode.
Keep writes the format that came in, except for GIF and AVIF, which a canvas cannot write and which become PNG.
JPEG and WebP only. Above about 90 the file grows fast for very little; below 60 it shows.
JPEG has no transparency, so a PNG with transparent corners needs something behind it. Ignored for PNG and WebP.
Choose an image to resize it. Nothing is uploaded.
Resizing a photo should not involve uploading it. This does the work in the page: the file is read by the browser, drawn to a canvas, and encoded back, and nothing is sent anywhere. You can watch the network panel while you use it.
The part that is actually hard about resizing is quality. A browser drawing a 4000 pixel photo straight into a 400 pixel box throws most of the pixels away and the result looks chewed. This halves the image repeatedly until it is close to the target, then does the last step, which is how image libraries have always done it.
How to use
- Drop an image on the panel, or click it to choose one. JPEG, PNG, WebP, GIF and AVIF all read; the first three also write.
- Choose how to size it. Fit inside keeps the proportions and stays inside the box you give. Cover fills the box and crops what hangs over, from the middle. By width or by height sets one side and works the other out.
- Set the format and quality if you want them changed. Keep writes the format that came in.
- Download. The name says the new size.
The before and after panels are both the real thing, so a quality setting that went too far is visible before you save it.
Example
A 4000 by 3000 photo from a phone, 2.3 MB, at the defaults:
4000×3000 to 1200×900 · 2.29 MB to 234 KB, 90 percent smaller · JPGThat is the size most sites actually need: 1200 pixels wide covers a full-width image on a normal screen, and at quality 82 the difference from the original is invisible at that size.
Two settings worth knowing:
- Cover with 1200 by 630 gives you an Open Graph image from any photo, cropped from the middle rather than squashed.
- Percent at 50 on a 2x screenshot gives you the 1x version, which is what a documentation page usually wants.
Pitfalls
JPEG has no transparency. A PNG with transparent corners saved as JPEG gets whatever is in Background behind transparency behind it, white by default. Save as PNG or WebP to keep it.
Enlarging invents detail. It is off by default for that reason. A 400 pixel image scaled to 1600 is a 400 pixel image with blurry edges; no tool changes that.
GIF and AVIF read but do not write. A canvas can only encode JPEG, PNG and WebP, so those two come out as PNG unless you pick something else. An animated GIF loses its animation: only the first frame is drawn.
Quality above 90 is mostly wasted. The file grows quickly and the difference is hard to see. Below about 60 the blocks start to show in flat areas like sky.
EXIF is not carried over. Re-encoding drops the metadata, including the orientation tag, the camera model and any location. For a photo going on the web that is usually a feature; if you need the metadata, keep the original.
Large files are held in memory. A 50 megapixel image at three different sizes is several hundred megabytes of canvas. The limit here is 30 MB per file, which is well inside what a phone can manage.
Compatibility
Everything runs in the browser, using createImageBitmap for decoding,
<canvas> for drawing, and canvas.toBlob for encoding. WebP writing needs
Chrome 50, Firefox 96 or Safari 14 and later; before that, WebP silently falls
back to PNG, which the summary will tell you because it names the format it
actually wrote.
Reading AVIF needs Chrome 85, Firefox 93 or Safari 16.
Nothing is uploaded, which also means nothing is queued: the tool works offline once the page has loaded, and the file never becomes someone else’s problem.
Frequently asked questions
Can I resize several images at once?
cwebp or ImageMagick command.Why is the downloaded file bigger than the original?
Does it strip the EXIF orientation?
createImageBitmap honours the orientation tag, so
a photo that was rotated by metadata comes out rotated in the pixels, which is
what you want on the web.