Image Resizer
Resize images online for free. Change dimensions of JPG, PNG, and WebP images while maintaining aspect ratio. Secure, client-side resizing.
Formula
New Height = New Width × (Original Height ÷ Original Width)
Keeping the aspect ratio means holding height ÷ width constant, so setting one dimension fixes the other. A 4000 × 3000 photo (ratio 0.75) narrowed to 1200 px wide becomes 1200 × 0.75 = 900 px tall. The resize itself is a canvas redraw: pixels are resampled to the new grid, so shrinking discards data permanently and enlarging invents it — always resize down from the original, never up from an already-shrunk copy.
Worked Examples
Example 1: Social Media Avatar
Problem:Resize profile pic to 400x400.
Solution:Upload image -> Set Width: 400 -> Set Height: 400 (if square) -> Resize.
Result:Square avatar ready.
Example 2: Website Hero Image
Problem:Reduce 4K image to HD.
Solution:Upload 3840x2160 image -> Set Width: 1920 -> Keep Ratio: On -> Height updates to 1080 -> Resize.
Result:Optimized 1080p image.
Frequently Asked Questions
How does the image resizing work?
It uses your browser's built-in canvas capabilities to re-render the image at the new dimensions you specify.
Is my image secure?
Yes. The resizing happens 100% in your browser. Your image is never uploaded to any server.
Why is my resized photo a bigger file than the original?
Because the output is PNG, which is lossless. A JPEG photograph is heavily compressed with a lossy codec tuned for continuous-tone images; re-encoding it as PNG stores every pixel exactly and routinely produces a larger file even at smaller dimensions. PNG is the right choice for screenshots, logos and anything with flat colour or transparency, but for photographs you will usually want to re-save the result as JPEG or WebP afterwards.
Does resizing strip my EXIF metadata?
Yes. Drawing an image onto a canvas keeps only the pixels, so camera model, GPS coordinates, capture date, copyright fields and the orientation flag are all discarded in the output. That is useful when you are deliberately stripping location data before sharing a photo, and a genuine loss when you need the capture metadata - archive the original before resizing.
What resampling method does the browser use?
The browser's own canvas scaler, which is typically bilinear or bicubic with smoothing enabled. This is good for photographs but blurs hard edges, so pixel art and screenshots of text can come out soft. For pixel art specifically, a nearest-neighbour scaler preserves the crisp block edges that a smoothing filter destroys.
Should I resize in one step or several?
One step, from the original. Each resize resamples pixels and throws information away permanently, so shrinking 4000px to 2000px and then to 800px loses more detail than going straight from 4000px to 800px. It also matters which file you start from: always keep the full-resolution original and generate each size you need from it, rather than re-resizing an already-shrunk copy.
What dimensions should I use for the web?
Match the largest size the image will actually be displayed at, then double it only if you need to serve high-density screens. A 1200px-wide content column needs a 1200px image, or 2400px for a 2x display - anything beyond that is bytes the visitor downloads and the browser immediately discards. Always set explicit width and height attributes on the tag as well, so the browser reserves the space and avoids a layout shift.
What formats are supported?
You can upload JPEG, PNG, GIF, WebP, and BMP. The output is currently standard PNG.
Does resizing affect quality?
Scaling down (making smaller) usually preserves quality well. Scaling up (making larger) will likely result in pixelation or blurriness, as you cannot create detail that isn't there.
How do I maintain aspect ratio?
Ensure the 'Keep Ratio' switch is enabled. This automatically calculates the height when you change width (and vice versa) to prevent stretching.
Background & Theory
Resizing vs. Cropping:
- Resizing changes the pixel dimensions by stretching or shrinking the entire image.
- Cropping cuts out a part of the image.
Interpolation:
When you change image size, the computer has to guess what the new pixels look like.
- Scaling Down (Downsampling): The computer averages pixels together. Generally produces sharp results.
- Scaling Up (Upsampling): The computer must invent new pixels based on neighbors. Often causes blurriness.
Aspect Ratio:
The relationship between width and height (e.g., 16:9, 4:3). Maintaining this prevents "squashed" or "stretched" images.