Image Resizer Online Free
Resize images to exact pixel dimensions or percentage. Supports JPG, PNG, WebP, GIF. No upload, no watermark, fully private.
Resize Settings
Loaded Files
Fill, contain, or cover: three ways to fit an image into a box
Resizing an image is one line of code, ctx.drawImage(img, 0, 0, width, height), but the interesting part is what happens when your target dimensions don’t share the source’s aspect ratio. This tool implements three distinct fit strategies for that mismatch, the same three concepts CSS uses for object-fit, and it runs every one of them through the Canvas API locally, batch processing an entire folder of images without ever uploading a file.
The three fit modes
drawImage call. If the target aspect ratio differs from the source, the image distorts, this mode never crops or letterboxes, it just stretches.
Math.min(targetW/srcW, targetH/srcH), the smaller of the two axis ratios, so the entire source fits inside the target box without cropping. The output canvas is sized to the scaled image itself, not the requested box, which is why contain output dimensions can differ slightly from what you typed.
Math.max(targetW/srcW, targetH/srcH), the larger ratio, so the scaled image fully covers the target box and overflows on one axis. The overflow is then centered and clipped by drawing the scaled image at a negative offset equal to half the excess.
Notice cover never actually crops pixels off in a separate step, it draws the oversized image at a negative coordinate so the canvas boundary itself does the clipping. Anything outside the 0,0 to targetW,targetH rectangle simply never gets painted.
Aspect ratio lock and pixel-quality interpolation
When the lock is on, typing a width recalculates height as Math.round(val * origH / origW) against the first loaded image’s original ratio, and vice versa for height, so the proportions never drift. The actual upscaling or downscaling quality comes from the browser’s own image smoothing, which the canvas applies automatically using a bilinear or bicubic-like filter depending on the browser, there’s no custom interpolation code in the tool itself, it relies on the platform’s default resampling.
| Mode | Output size | Distortion risk |
|---|---|---|
| Fill | Exactly your target | Yes, if ratios differ |
| Contain | May be smaller than target on one axis | None |
| Cover | Exactly your target | None, crops instead |
origW * pct / 100, so a 10-image batch with mixed source sizes produces proportionally resized outputs at different pixel dimensions from each other, unlike pixel mode where every output shares the same target box.Batch processing
Every loaded file is resized independently and in parallel, each with its own onload callback, and results are collected into an array before the download-all button becomes available.
Format conversion
The output MIME type can differ from the input, so a batch of PNGs can be resized and exported as JPEG or WebP in the same pass, with quality only applied when the target format supports it.
ZIP download
When more than one file is processed, results are bundled with JSZip into a single archive; if that library isn’t available, the tool falls back to firing sequential downloads spaced 600ms apart.
- CanvasRenderingContext2D.drawImage(), the scaling primitive behind every fit mode.
- CSS object-fit, the property whose fill, contain, and cover semantics this tool mirrors.
- imageSmoothingQuality, the browser setting controlling resample sharpness during scaling.
Resizing jobs in practice
Batch resizing a folder of product photos to a marketplace’s required dimensions, cropping a set of portraits to a uniform square avatar size with cover mode, shrinking camera photos to fit an email attachment limit, generating a consistent thumbnail grid where every image needs the exact same box regardless of source aspect ratio, or converting a batch of screenshots to WebP at a smaller footprint while resizing them down for a documentation site.
Questions About Image Resizer Online Free
No. All processing happens in your browser using the Canvas API. Your images never leave your device. This makes the image resizer online free completely private.
To resize an image without losing quality, avoid upscaling beyond the original resolution. When resizing down, set output format to PNG for lossless results, or use WebP or JPG at 90% or above quality. The aspect ratio lock prevents distortion.
Yes. Drag and drop or select up to 50 images at once. All files are resized with the same settings and you can download them individually or all together.
The tool accepts JPG, PNG, WebP, GIF, BMP, and SVG as input. You can also convert the output to JPG, PNG, or WebP in the same step. GIF animation is not preserved — the first frame is used.
Contain scales the image to fit within the target dimensions while preserving the aspect ratio — the output may be smaller than the target. Cover scales and crops to fill the exact target dimensions. Fill stretches the image to exactly match, which may distort it.
Yes. Built-in presets include 1920×1080 for YouTube and Facebook covers, 1200×628 for Open Graph images, 1080×1080 for Instagram square posts, and 1500×500 for Twitter headers. You can also type any custom dimensions.
The tool handles files up to 25 MB each and up to 50 files per batch. Very large images may take a moment to decode and draw depending on your device. Performance depends on your browser and available memory, not a server.
From the blog
Notes on images and colour
Format choices, compression tradeoffs and accessible palettes.
