Image Resizer

{{ modeLabel }} {{ formatLabel }} {{ qualityBadge }} Max {{ max_kb }} KB {{ keepRatio ? 'Aspect locked' : 'Aspect free' }} No upscale Demo image

Unable to resize this image

Source image:

Use PNG, JPEG, WebP, GIF, SVG, BMP, or any image your browser can decode.

Files stay in this browser; paste also works when an image is on your clipboard.

Ignored {{ ignoredCount }} extra file(s). This tool processes one image at a time.

Resize settings

Resize preset:

Choose a starting point, then adjust any control below.

Resize mode:

Pixel size:

px wide

px high

Aspect lock:

Leave on for fit-mode dimension entry; contain and cover preserve the source by padding or cropping instead of stretching.

Scale: {{ percent }}%

Use Percent scale for quick 25%, 50%, 75%, 100%, or 200% jobs.

No upscale:

Keep on for web assets; turn off only when enlargement is acceptable.

Output format:

Auto keeps the source container when it is JPEG, PNG, or WebP, then falls back to JPEG for other decoded images.

Quality: {{ qualityBadge }}

File size cap:

Enter 0 to use the quality slider, or a KB target such as 250 for upload limits.

Background:

Use a matte color such as #ffffff when the output must sit on a white page.

Sharpen after resize:

Use for softened photos or screenshots; leave off for smooth gradients.

Unsharp amount:

Range: 0 to 500; 80 is a moderate starting point.

Unsharp radius:

Range: 0 to 5 px; 0.6 keeps sharpening tight for web images.

Unsharp threshold:

Range: 0 to 255; higher values protect flat skies, skin, and gradients.

Filename template:

Available tokens: {name}, {w}, {h}, {pct}, {mode}, and {ext}.

Download Open

Updating resized preview...

Original {{ originalLabel }}

Resized {{ resultLabel }}

Field	Value	Detail	Copy
{{ row.field }}	{{ row.value }}	{{ row.detail }}

Check	Status	Recommendation	Copy
{{ row.check }}	{{ row.status }}	{{ row.recommendation }}

Embed:

Customize

Include current inputs

Size

Advanced

Width

Height

Aspect ratio

Max height

Collapsible embed

Allow fullscreen

Referrer policy

Sandbox tokens

Image size is easy to mistake for image quality. A large camera photo can have enough detail for print, yet be awkward for an email attachment, a shop listing, a profile square, or a web banner that needs to load quickly. Resizing changes the pixel grid itself, so the decision is about geometry first: how wide the final image should be, how tall it should be, and what should happen when the source shape does not match the destination frame.

Pixel dimensions are the main unit. A 4032 by 3024 photo contains about 12.2 million pixels, while a 1600 by 900 banner contains about 1.4 million. Fewer pixels usually means a smaller file and faster display, but it also leaves less detail for zooming, later cropping, and future edits. Enlarging moves in the other direction: the frame gets bigger, but the missing detail has to be interpolated from pixels that already exist.

Most resize jobs fall into a small set of framing choices:

Keep the whole image visible when the subject, label, border, diagram, or screenshot must not be cut.
Fill an exact shape when the destination requires a square avatar, fixed card thumbnail, hero banner, or marketplace canvas.
Reduce file weight when the image is already visually large enough and delivery speed matters more than every fine texture.
Preserve transparency when logos, icons, cutouts, or UI graphics need to sit over changing backgrounds.

Aspect ratio is the proportion between width and height. When the source ratio and target ratio match, resizing can keep the whole image without padding or crop. When they differ, the tradeoff becomes visible. Keeping everything may leave empty space, while filling every pixel may cut off part of the subject. Stretching width and height independently is rarely suitable for photos because faces, circles, logos, and product shapes stop looking natural.

File format is a separate decision from pixel size. JPEG is common for photographs and small delivery files, but it has no transparency. PNG is useful for exact artwork, screenshots, and alpha channels, but it can stay large. WebP can be compact and can preserve transparency, though the destination has to accept it. A good resize result therefore balances pixel dimensions, crop safety, compression, transparency, and the rules of the place where the file will be uploaded.

How to Use This Tool:

Start with the source image, then decide whether the destination needs a maximum size, an exact frame, or a percentage change.

Add one file with Browse image, drop it into Source image, paste an image from the clipboard, or use Use demo. The source area should show the filename, original dimensions, and file size after the browser decodes the image.
Choose a Resize preset when a common target fits the job. The presets include Web hero 1600 x 900, Email inline 600 px wide, Social square 1080 x 1080, Marketplace contain 1200 x 1200, and Half-size WebP. Select Custom settings when you need your own dimensions or format.
Set Resize mode. Use Percent scale for simple 25%, 50%, 75%, 100%, or 200% jobs. Use Fit within bounds to preserve the whole image inside maximum dimensions. Use Contain on canvas for exact dimensions with padding, or Cover canvas for exact dimensions with a centered crop.
Enter Pixel size or adjust Scale. Keep Aspect lock on in fit mode when editing only one dimension. Keep No upscale on for web assets unless a larger but softer output is acceptable.
Pick Output format and Quality. Leave Output format on Auto when the source is already JPEG, PNG, or WebP and the destination accepts that format. Enter a File size cap only for JPEG or WebP targets, because PNG output ignores the quality search in this workflow.
Open Advanced for Background, Sharpen after resize, unsharp settings, or a Filename template. A white background is useful when transparent pixels must be flattened for JPEG.
Check Preview Compare before downloading. Use Resize Details for source and output dimensions, Delivery Checks for warnings such as size cap or upscale status, and JSON when you need a structured record of the run.

If decoding fails, try PNG, JPEG, WebP, GIF, SVG, BMP, or another image type your browser supports. If resizing fails after the image loads, lower the requested dimensions so the output stays at or below 16000 px per side and 80 megapixels total.

Interpreting Results:

Use the preview as the final visual check and the details table as the measurement check. A file can be small enough for upload and still be wrong if a face is cropped, a logo is padded in the wrong color, transparency was flattened, or an enlarged source looks soft.

Common image resize outcomes and checks
What you see	What it usually means	What to check next
One output dimension is below the requested box	`Fit within bounds` preserved the source aspect ratio.	Switch to contain or cover only if the destination requires exact width and height.
Exact dimensions with visible margins	`Contain on canvas` centered the whole image and filled the unused area with `Background`.	Verify that the padding color works with the website, listing, or document background.
Exact dimensions with missing edges	`Cover canvas` center-cropped the source before resizing.	Look for clipped faces, text, product borders, signatures, or captions.
Size cap remains above target	The JPEG or WebP quality search reached 10% without fitting under the cap.	Reduce dimensions, choose WebP if accepted, or raise the KB limit.
Transparent pixels become solid	JPEG output flattened the alpha channel over the selected background color.	Choose PNG or WebP when transparency must remain.

Do not treat a green delivery status as proof of visual quality. Open the downloaded file when the destination is important, especially after strong compression, sharpening, cover crops, or transparency changes.

Technical Details:

Raster resizing maps source pixels onto a new canvas. Downscaling combines detail from many source pixels into fewer output pixels, which reduces file weight and can soften edges. Upscaling spreads existing samples over a larger grid. Interpolation can make the larger image smoother, but it cannot recover detail that the source never captured.

The geometry is controlled by scale factor and aspect ratio. A fit resize chooses the largest scale that stays inside the requested box. A contain resize uses the same fitted image, then places it on an exact canvas. A cover resize first chooses the crop that matches the requested ratio, then scales that crop to the exact canvas.

Formula Core:

The formulas below use source width Wsrc, source height Hsrc, box width Wbox, box height Hbox, and scale factor f. Output dimensions are rounded to whole pixels.

r = \frac{W_{src}}{H_{src}}

W_{out} = round (W_{src} \cdot f), H_{out} = round (H_{src} \cdot f)

f_{fit} = \min (\frac{W_{box}}{W_{src}}, \frac{H_{box}}{H_{src}})

f_{cover} = \max (\frac{W_{box}}{W_{src}}, \frac{H_{box}}{H_{src}})

A 2400 by 1350 source fitted inside 1600 by 900 uses min(1600 / 2400, 900 / 1350) = 0.6667, so rounding gives a 1600 by 900 output. A 2000 by 1200 source contained inside 1200 by 1200 uses min(1200 / 2000, 1200 / 1200) = 0.6, so the image area becomes 1200 by 720 and the remaining vertical space becomes padding.

Mode Rules:

Image resize mode rules and risks
Mode	Geometry rule	Useful for	Watch for
`Percent scale`	Apply the same 10% to 200% multiplier to width and height.	Quick half-size or double-size checks.	Values above 100% enlarge the source unless `No upscale` is on.
`Fit within bounds`	Use the smaller width or height scale factor.	Keeping the whole image visible.	The result may not fill an exact frame when ratios differ.
`Contain on canvas`	Fit the whole image, center it, and fill the requested canvas with `Background`.	Listings, certificates, and product photos that need exact dimensions.	Padding becomes part of the final file.
`Cover canvas`	Crop the source to the requested ratio, then scale the crop.	Avatars, thumbnails, banners, and square social images.	Important edge content can be removed.

With No upscale enabled, percent and fit scale factors are capped at 1. For a cover canvas larger than the source, the safer result switches to a padded layout instead of forcing enlargement. That protects sharpness but means a requested cover frame may behave more like contain when the source is too small.

Encoding and Bounds:

Image encoding and validation bounds
Setting or limit	Rule	Practical effect
`Quality`	JPEG and WebP use a lossy value from 10% to 100%.	Lower values can shrink the file but may add blockiness, blur, or color noise.
`File size cap`	JPEG and WebP try progressively lower quality values until the blob fits or reaches 10% quality.	Detailed images may still exceed the cap at minimum quality.
PNG output	PNG is treated as lossless here and ignores the quality slider and cap search.	Use it for transparency or exact screenshots, not for the smallest photo file.
JPEG transparency	Transparent pixels are drawn over the selected background before encoding.	Use PNG or WebP when the alpha channel must survive.
Canvas size	Output must stay at or below 16000 px per edge and 80 megapixels total.	Reduce width, height, or scale when a very large request fails.

Compression is content-dependent. A flat logo, a dense foliage photo, a text-heavy screenshot, and a product image on a plain background can produce different file sizes at the same dimensions and quality. Compare alternate runs fairly by keeping the source, dimensions, format, quality, background, and sharpening settings consistent.

Privacy Notes:

The selected image is processed in your browser. The preview, resized file, details table, delivery checks, and JSON record are created from the local file you choose, paste, or load as the demo.

The image content is not uploaded to a server by the resizing workflow.
A third-party resizing script may be loaded by the page, so a network request can occur for the script even though your image file stays local.
Temporary preview links are browser object URLs. They work for the current session and are not public sharing links.

Worked Examples:

Wide banner photo

A 2400 by 1350 photo using Web hero 1600 x 900 already matches 16:9, so Fit within bounds produces 1600 by 900 without padding or crop. Resize Details should show the new dimensions and the size change, while Delivery Checks reports whether the 400 KB JPEG cap was met.

Square listing from a wide product shot

A 2000 by 1200 product photo with Marketplace contain 1200 x 1200 scales the image area to 1200 by 720 and places it on a 1200 by 1200 canvas. The preview should keep the whole product visible, with padding above and below in the selected background color.

Social square with crop risk

An 1800 by 1200 landscape image resized with Social square 1080 x 1080 must crop to a square before resizing. The centered crop removes source pixels from the left and right edges, so check Preview Compare for faces, text, and product borders before downloading.

Small source protected from enlargement

A 900 by 600 source aimed at a 1200 by 1200 cover frame will not be enlarged while No upscale is on. The output can still be a 1200 by 1200 canvas, but the image area remains 900 by 600 with padding. Use a larger source or turn off the guard only when a softer result is acceptable.

Advanced Tips:

Use Contain on canvas for product marketplaces when the full item must remain visible inside a fixed square.
Use Cover canvas only after checking the preview for important edge content, because the crop is centered.
Set Background before choosing JPEG for transparent artwork, since that color becomes part of the file.
Keep Sharpen after resize modest for photos and screenshots. Strong unsharp settings can make halos around text and edges.
When a KB cap fails at 10% quality, reducing pixel dimensions usually helps more than lowering quality further.

FAQ:

Why did fit mode not produce the exact width and height?

Fit within bounds preserves the full image and its aspect ratio. If the requested box has a different ratio, one side stays below the maximum. Use Contain on canvas for exact dimensions with padding or Cover canvas for exact dimensions with cropping.

Why is the output still above the size cap?

For JPEG and WebP, the encoder searches down to 10% quality. If the file still exceeds the cap, reduce the pixel dimensions, choose a more compact accepted format, or raise the KB target.

Can transparency survive the resize?

PNG and WebP can preserve transparency. JPEG cannot, so transparent pixels are flattened onto the selected Background color before the file is saved.

Why does an enlarged image look soft?

Upscaling spreads existing pixels across a larger grid. Turn No upscale back on or start from a larger source. Sharpen after resize can increase edge contrast, but it cannot create missing detail.

What should I do after a decode or canvas-size error?

Use a browser-supported source format first. If the image loads but resizing fails, lower Pixel size or Scale until the output is below the canvas limits reported in the warning.

Glossary:

Pixel dimensions: Image width and height measured in pixels, such as 1600 by 900.
Aspect ratio: The proportional relationship between width and height, such as 16:9, 4:3, 3:2, or 1:1.
Canvas: The final pixel frame that receives the resized image, crop, padding, or background color.
Resampling: The process of calculating a new pixel grid from the source pixels.
Crop: Removal of source pixels outside the chosen frame.
Padding: Background area added around an image when the whole source fits inside a different ratio.
Alpha channel: Transparency information in an image, preserved by formats such as PNG and WebP but not by JPEG.
Quality: The lossy JPEG or WebP encoding setting that trades smaller files against visible fidelity.

References:

Image file type and format guide, MDN Web Docs, last modified April 7, 2026.
HTMLCanvasElement: toBlob() method, MDN Web Docs, last modified February 12, 2026.
RFC 9649: WebP Image Format, Internet Engineering Task Force, November 2024.