Image Resizer

Resizing an image before you publish it is the simplest way to cut page weight and meet a platform’s dimension requirements. This tool redraws your picture at a new size on a browser canvas and exports it as PNG, JPEG, or WebP, with a side-by-side comparison that reports the exact dimensions and file sizes of both versions. It handles exact pixel targets, percentage scaling, and six social-media presets, and it also doubles as a quick format converter because export format is chosen in the same step.

How to Use

1. Add an image by dragging a JPEG, PNG, or WebP onto the drop zone or clicking to browse.
2. Choose a resize mode — exact pixels or a percentage from 1% to 1000%.
3. Optionally pick a preset from the preset dropdown; doing so switches the mode back to pixels and fills in the target box.
4. Set the output format (PNG, JPEG, or WebP) and, for lossy formats, drag the quality slider.
5. Click resize, compare, then download the result as resized-image with the matching extension.

Resize Modes and Aspect Ratio

Percentage mode simply scales both sides: a 4000×3000 photo at 25% becomes 1000×750, with each side rounded to the nearest pixel and never below 1. Pixel mode without the aspect lock produces exactly the width and height you type, even if that stretches the image. With the lock on, the tool computes ratio = min(targetWidth ÷ originalWidth, targetHeight ÷ originalHeight) and multiplies both original sides by that single ratio, so the picture fits inside the target box without distortion. That means the output is often smaller than the box in one direction.

Percentage mode is fastest when you know the factor you want — half size, a third size, or double for a retina asset — and it ignores the pixel fields entirely. Pixel mode is better when a platform publishes a hard requirement, because you can enter the exact figure and trust the output. Both modes share the same rounding rule: each output side is rounded to the nearest whole pixel with a floor of one, so a 33% scale of a 101×101 image yields 33×33 rather than a fractional value. When the lock is on and you edit one pixel field, the other updates live; turn it off only when you deliberately want distortion.

Worked Examples

Original	Setting	Aspect lock	Result
4000×3000	25%	n/a	1000×750
4000×3000	1080×1080 preset	on	1080×810 (fit to width)
4000×3000	1080×1080 preset	off	1080×1080 (stretched)
800×600	1200×630 preset	on	840×630 (upscaled to fit height)
1920×1080	1920×1080, 50%	n/a	960×540

In the third row the aspect lock is off, so a 4:3 photo is distorted into a square — usually not what you want for a post. In the fourth row the image is smaller than the target, so fitting it inside the 1200×630 box scales it up to 840×630 by the limiting height.

Output Formats Compared

Format	Transparency	Compression	Best for
PNG	Yes	Lossless, larger files	Screenshots, logos, sharp graphics, images that need transparency
JPEG	No (white-filled)	Lossy, quality 1–100	Photographs where a small quality loss is acceptable
WebP	Yes	Lossy or lossless, usually smallest	Photos and graphics for the modern web

WebP typically produces the smallest file at comparable quality and is supported by all current browsers, which makes it a strong default for web publishing. Reach for PNG when you need exact pixels or alpha, and JPEG when maximum compatibility with older software matters.

Quality, Transparency, and Other Trade-Offs

The quality slider only appears for JPEG and WebP and does not affect dimensions. Dropping quality from 90 to 70 can shrink a photo substantially with little visible change, while going below about 50 usually introduces blocky artifacts around edges and text. Because JPEG has no alpha channel, transparent regions are painted white before encoding, so a logo with a transparent background should stay PNG or WebP. Percentage scaling and pixel scaling both interpolate when enlarging, and downscaling to the exact display size generally looks at least as sharp as the original once the browser renders it at that size.

A useful habit is to export the same image twice, once at quality 85 and once at 60, and compare both the previews and the reported file sizes. The gap is often large in bytes and small on screen, which is exactly the trade you want to make for the web. Keep in mind that resizing and re-encoding compound: repeatedly opening and saving a JPEG loses a little quality each time, so start from the original and make all your sizing and format decisions in one pass rather than editing the output again later.

Practical Tips

• Resize to the largest size the page will actually display, then let a compressor trim the quality; publishing a 4000px image in a 800px slot wastes bandwidth.
• Keep the aspect lock on unless you deliberately want a stretch, and double-check presets — “fit inside” can leave different dimensions than the preset name implies.
• Compare the reported file sizes before downloading; the same photo as WebP 80 is often a fraction of the PNG size.
• If an alert about width or height appears, you have exceeded the 10,000px cap or entered a value below 1 — reduce the target and retry.
• For social platforms, treat the preset as a target box with the aspect lock on; a result smaller than the box in one direction means the platform accepts your original ratio instead of cropping it.
• When preparing images for a responsive site, export a few fixed widths (for example 640, 1280, and 1920) rather than one giant file the browser must scale down.

Related Tools

• Image Compressor — Reduce image file size with quality-based compression before or after resizing.
• Image Cropper — Crop, rotate, and flip images to frame the perfect composition.
• Image Format Converter — Convert images between PNG, JPEG, and WebP without resizing.
• Favicon Generator — Turn any image into a complete set of browser favicons.