{{ summaryTitle }}
{{ summaryValue }}

{{ summaryLine }}

Mode{{ modeLabel }} Format{{ formatLabel }} Pixel area{{ pixelChangeLabel }}
{{ summaryAnnouncement }}
Image source and resize settings
Use one PNG, JPEG, WebP, GIF, SVG, BMP, AVIF, or other image this browser can decode.
{{ sourceDropTitle }} {{ sourceDropLine }}

{{ sourceStatusLine }}

Ignored {{ ignoredFileCount }} extra {{ ignoredFileCount === 1 ? 'file' : 'files' }}. This tool processes one image at a time.

Choose a web, email, social, marketplace, or half-size starting point.
{{ modeHelpText }}
{{ dimensionHelpText }}
px
{{ normalizedPercent }}%
Use 50% for half-size or 200% for double-size when enlargement is allowed.
Turn off only when you want to enter independent maximum bounds.
{{ keepRatio ? 'Derive paired fit bound' : 'Edit bounds independently' }}
Keep enabled for web assets unless a larger but softer result is acceptable.
{{ no_upscale ? 'Prevent enlargement' : 'Allow enlargement' }}
Choose the container required by the next publishing or upload step.
Choose the destination matte before creating a padded or non-transparent output.
{{ normalizedQuality }}%
Use 80–90% for detailed photos and 60–75% for smaller web delivery files.
Enter 0 to follow the quality slider or a positive KB budget for an upload limit.
KB
Use modest sharpening for softened photos or screenshots; leave it off for smooth gradients.
{{ unsharp ? 'Sharpening enabled' : 'No sharpening' }}
Available tokens: {name}, {w}, {h}, {pct}, {mode}, and {ext}.
Original{{ sourceDimensionsLabel }}
Original source image preview
Resized{{ outputDimensionsLabel }}
Resized output image previewPreview pending
{{ chartExportStatus }}

The chart renderer is unavailable. The same pixel counts remain available in the resize receipt.

MeasureValueMeaningCopy
{{ row.label }}{{ row.value }}{{ row.detail }}
{{ tableExportStatus }}
CheckStatusRecommendationCopy
{{ row.label }}{{ row.status }}{{ row.detail }}
{{ tableExportStatus }}

Pixel dimensions determine how much image detail is available and how much bitmap data a browser, message, or publishing system must handle. A 4032 by 3024 photo contains about 12.2 million pixels; a 1200 by 900 copy contains about 1.1 million. The smaller copy can be faster to deliver, but it also leaves less detail for zooming, printing, and later crops.

Resizing becomes a framing decision when the source and destination have different aspect ratios. Keeping the whole source visible may leave unused space. Filling an exact frame may crop an edge. Enlarging can meet a pixel requirement, but interpolation cannot recover detail that the source never captured.

Comparison of image resizing modes
ModeGeometryMain tradeoff
Percentage scaleApplies one scale factor to both dimensions.Simple and proportional, but it does not target a fixed frame.
FitKeeps the complete image inside maximum width and height.The output may be smaller than one requested bound.
ContainFits the complete image on an exact canvas and fills unused space.No crop, but padding becomes part of the output.
CoverCenter-crops the source so an exact canvas is completely filled.No padding, but edge content is removed when ratios differ.

File size is related to pixel count, format, image content, and encoding quality. JPEG and WebP can trade detail for fewer bytes; PNG is lossless and ignores a lossy quality target. A file-size limit is therefore a best-effort encoding search, not a promise that every image can reach the requested number of kilobytes.

Choose geometry before compression. A smaller frame usually saves more data than repeatedly lowering quality, while aggressive enlargement produces a larger file without creating new visual information. Preserve transparency with PNG or WebP when needed; JPEG replaces transparent areas with a chosen background.

How to Use This Tool:

Start from the destination's pixel shape, then tune encoding only after the framing looks right.

  1. Choose, drop, or paste one browser-readable image. The source may be up to 100 MB and 50,000 pixels on either side, subject to browser memory and decoding support.
  2. Select a preset or choose Percent scale, Fit within bounds, Contain on canvas, or Cover canvas. Check the preview for padding or cropped edges before continuing.
  3. Keep No upscale enabled unless a larger but softer result is acceptable. In Cover mode, a frame larger than the source changes to a contained, padded result when enlargement is blocked.
  4. Choose JPEG, PNG, WebP, or automatic format handling. Set the background before using contain padding or JPEG, because transparent pixels are flattened for JPEG output.
  5. Adjust quality or enter a positive File size cap for JPEG or WebP. Confirm whether the delivery check says the cap was met, missed, ignored, or off before downloading.

Interpreting Results:

Verify the final width and height first, then inspect the preview at normal size and around sharp edges, text, faces, and gradients. Source crop shows whether pixels were removed; Rendered image area reveals padding and its offset. The preview and download use the same encoded image data.

Fewer pixels does not automatically mean acceptable quality, and a met byte cap does not guarantee a good-looking result. Compare the actual encoded size and quality with the destination requirement. When enlargement is allowed, sharpening can improve edge contrast but cannot restore missing texture or readable text.

Technical Details:

Aspect ratio is width divided by height. Fit and contain use the smaller of the width and height scale factors so the complete source remains visible. Cover uses the destination ratio to choose a centered source rectangle, then maps that crop onto the exact output canvas.

Formula Core

For source width Ws, source height Hs, and positive target bounds Wt and Ht, the fit scale is:

s=min(WtWs,HtHs)

A zero bound is treated as unconstrained. With No upscale, the effective scale is capped at 1. Percentage mode instead starts with s = percentage divided by 100 and applies the same cap when enlargement is blocked. Output dimensions are rounded to the nearest whole pixel.

The pixel-area change compares source and output canvases. A positive value means fewer output pixels:

C=100×(1−Wo×HoWs×Hs)

Transformation Core

Image resize transformation stages
StageTransformation
DecodeThe browser decodes one image and exposes its natural pixel dimensions. Format support varies by browser.
GeometryScale and Fit create a proportional output. Contain centers the scaled image on a colored canvas. Cover center-crops the source to the target ratio.
ResampleThe chosen source rectangle is resized to whole-pixel output dimensions. Optional unsharp settings adjust edge contrast after resizing.
FlattenJPEG output fills transparent pixels with the selected background. Contain also uses that color for padding.
EncodeJPEG, PNG, or WebP bytes are created in the browser. Automatic mode keeps a JPEG, PNG, or WebP source type; other decoded source types fall back to PNG.

A positive byte cap affects JPEG and WebP only. Encoding first tries the selected quality. If the result is too large, nine binary-search passes look for the highest quality from 10% through the requested setting that meets the cap. If even 10% misses, the file is returned with a missed warning. PNG ignores the cap because the browser encoder does not expose a comparable lossy quality control.

Output is limited to 16,000 pixels on either side and 80 million canvas pixels. Large sources can still exhaust memory before those output limits are reached. Color profiles, metadata, animation, and format-specific features are not preserved by a fresh canvas encoding, so the downloaded file should be checked in its destination workflow.

Privacy Notes:

Source pixels and generated image bytes stay in the current browser session and are not uploaded or placed in a shareable address. Closing or reloading the page discards the selected file and generated result. A browser may load the image-processing support code separately, but the source image itself remains local.

Worked Examples:

Fit a camera photo inside a banner

A 4032 by 3024 image fitted inside 1600 by 900 uses the height factor, producing 1200 by 900. The full photo remains visible, the width stays below its maximum, and output area falls by about 91.1%. A 1600 by 900 result would require cropping because the source is less wide than the destination ratio.

Cover a square frame

Covering a 1080 by 1080 canvas from the same 4032 by 3024 source takes a centered 3024 by 3024 crop, beginning 504 pixels from the left edge, then resizes that square to 1080 by 1080. Contain would keep the full photo and add padding instead.