Image Resizer

What is an Image Resizer?

An image resizer changes a picture to new pixel dimensions — a different width and height — and gives you back the resized file. You pick an image, the tool reads its current size, you set the dimensions you want, and it redraws the image at that size and downloads it as a PNG. With Keep aspect ratio ticked, you only change one number and the other follows automatically, so the photo never looks stretched.

Everything happens locally in your browser using an HTML canvas. The image is never uploaded to a server, which makes this fast, private, and usable for screenshots, photos, or any graphic you do not want leaving your device.

What does this tool do?

It takes one image and produces a copy at the exact pixel size you ask for. When you choose a file, the tool loads it and pre-fills two boxes with the image’s natural width and natural height — its real pixel dimensions — and shows a line like Original: 4000 × 3000 px.

The Keep aspect ratio checkbox (ticked by default) is the key to clean resizing: change the width and the height recalculates in the same proportion, and vice versa. Click Resize & download and the tool draws your image onto a canvas at the chosen size, then saves it as a PNG named after the original file plus its new dimensions.

How does it work?

The method is straightforward and there is no single numeric formula to memorise — the tool draws your image at a new size and hands you the result.

1. Load and measure. The browser loads the image and reads its naturalWidth and naturalHeight (the true pixel dimensions), which become the starting values in the width and height boxes.
2. Proportional linking. While Keep aspect ratio is ticked, the tool keeps the same shape by scaling the other side. If you set a new width, it computes new height = round(new width ÷ original width × original height). If you set a new height instead, it flips to new width = round(new height ÷ original height × original width). Results are rounded to whole pixels.
3. Draw and export. On Resize & download, the tool creates an HTML canvas sized to your chosen width and height, draws the image into it with drawImage, then converts the canvas to a PNG blob and downloads it.

Here every value is a length in pixels (px) — the dots that make up a screen image. “Width” is the horizontal pixel count, “height” the vertical one, and the aspect ratio is width compared to height (for example 4:3 or 16:9). Unticking the box removes the proportional link, letting you type any width and height independently — handy for an exact size, but it can stretch the picture if the numbers do not match the original ratio.

Examples

Each example matches exactly what the widget does: it pre-fills the original size, links the dimensions while the box is ticked, and downloads a PNG named with the new size.

Example 1 — a 4000×3000 photo down to 800 wide (ratio locked).

• You choose a 4000 × 3000 photo; the boxes pre-fill to 4000 and 3000.
• Keep aspect ratio stays ticked. You set the width to 800.
• The height auto-fills to 600, because 800 ÷ 4000 × 3000 = 600.
• Click resize: you download an 800 × 600 PNG (for a file named beach.jpg, the download is beach-800x600.png).

Example 2 — the same photo at 1200 wide.

• Original is again 4000 × 3000, ratio locked.
• You set the width to 1200.
• Height auto-fills to 900, since 1200 ÷ 4000 × 3000 = 900.
• Result: a 1200 × 900 PNG, the same 4:3 shape, just larger than Example 1.

Example 3 — drive it from the height instead (1920×1080).

• You choose a 1920 × 1080 image; boxes pre-fill to 1920 and 1080.
• With the box ticked, you set the height to 540.
• The width auto-fills to 960, because 540 ÷ 1080 × 1920 = 960.
• Result: a 960 × 540 PNG, still 16:9 — proving the linking works from either dimension.

Example 4 — unlock the ratio to force an exact size.

• Original is 1000 × 1000 (a square).
• You untick Keep aspect ratio and type width 1200, height 300.
• The tool does not adjust them — it draws the square into a 1200 × 300 canvas, so the image is stretched wide.
• Result: a 1200 × 300 PNG — the expected behaviour when the ratio is unlocked and the numbers do not match the original shape.

Quick resize reference

This table shows the height the tool auto-fills for a few common new widths, with Keep aspect ratio ticked, using new height = round(new width ÷ original width × original height). The last column is the downloaded PNG size.

Original (W×H)	New width you set	Auto-filled height	Downloaded PNG
4000 × 3000	800	600	800 × 600
4000 × 3000	1200	900	1200 × 900
4000 × 3000	2000	1500	2000 × 1500
1920 × 1080	1280	720	1280 × 720
1920 × 1080	800	450	800 × 450
1000 × 1000	250	250	250 × 250

Notice that every 4000 × 3000 row keeps the 4:3 shape and every 1920 × 1080 row keeps 16:9 — locking the ratio guarantees the resized image is a true scaled copy, never squashed.

Common uses

Resizing to exact pixel dimensions comes up constantly:

• Uploading within size limits — shrinking a phone photo to fit a forum, marketplace, or job-application cap on width.
• Web and blog images — scaling a large export down to a sensible content width (say 1200 px) so pages load faster.
• Profile pictures and avatars — hitting an exact square or pixel size a platform requires.
• Email, slides, and thumbnails — reducing oversized screenshots so they embed cleanly and load quickly.

Tips and common mistakes

A few details keep your resizes sharp and predictable:

• Leave the ratio locked for photos. With Keep aspect ratio ticked you only set one number; the other is computed so the image stays proportional. Untick it only when you truly need an exact, possibly non-matching size.
• Shrinking is safe; enlarging is not. Scaling down looks crisp, but setting a width larger than the original stretches limited pixels and can look soft — resizing adds no new detail.
• Resizing is not cropping. This tool scales the whole frame; it never trims edges. To change the shape itself (say 4:3 to 1:1) without distortion you would need to crop, which this tool does not do.
• Expect a PNG. The download is always .png, even if you loaded a JPG. PNG is lossless, so a resized photo may be larger than the original JPG despite having fewer pixels.
• Mind rounding. Auto-filled dimensions are rounded to whole pixels, so an odd target width on a 16:9 image may shift the ratio by a fraction of a pixel — harmless in practice.

Limitations and notes

This resizer accepts any image your browser can display (PNG, JPG, GIF, WebP, and similar) and shows a clear message if you pick a non-image file or leave a dimension blank or at zero. Output is always a PNG, produced by drawing the source image onto a canvas at your chosen size, so there is no separate quality or format setting. Because PNG is lossless, downsizing a JPEG can still yield a file larger in bytes even with fewer pixels — that is normal. There is no fixed dimension cap, but very large canvases are bounded by your browser’s memory.

Most importantly, the whole process runs privately in your browser. The image is loaded locally and redrawn with an HTML canvas in JavaScript — it is never uploaded, logged, or stored, which makes it safe for sensitive screenshots and fully usable offline once the page has loaded.

For more in-browser image work, pair this with the image to base64 converter, shrink file size with the image compressor, or clean up filenames and captions with the case converter, and browse the full Image & PDF tools collection.