Image aspect ratio crop and pad previewer

Choose local images to compare four output shapes side by side. Adjust positioning and background, then prepare cropped or padded PNGs without uploading your files.

Compare local image crops and padded outputs. JavaScript is required. Images stay in your browser.

How it works

Crop uses cover sizing: scale the image until both output dimensions are filled, then remove the overflow. Pad uses contain sizing: scale until the whole image fits, then fill empty space with your selected color. These follow the W3C cover and contain definitions.

crop scale = max(output width / image width, output height / image height) pad scale = min(output width / image width, output height / image height) crop loss = 1 − output area / scaled image area padding = 1 − scaled image area / output area

Downloads are 1,080 pixels wide: 3:4 gives 1,080 × 1,440; 4:5 gives 1,080 × 1,350; square gives 1,080 × 1,080; 9:16 gives 1,080 × 1,920. These are design templates, not platform limits. Position 0% aligns the leading edge, 50% centers and 100% aligns the trailing edge. In pad mode, position moves the empty space to the opposite edge.

Geometry is calculated without intermediate rounding; canvas height uses the nearest whole pixel and displayed percentages use two decimals. Crop loss measures area removed, not visual importance. A face near an edge may matter more than the percentage suggests.

Worked examples

3:4 portrait cropped to 4:5

A 3,000 × 4,000 image fills a 1,080 × 1,350 output at scale 0.36. Its scaled height is 1,440 pixels, so 90 pixels are removed: 6.25% crop loss. Centering removes 45 pixels from each end.

Square padded to 3:4

A 1,000 × 1,000 image becomes 1,080 × 1,080 inside a 1,080 × 1,440 canvas. No image area is lost; 25% of the canvas is padding, with 180 pixels above and below when centered.

Frequently asked questions

Does padding keep the whole image?
Yes. Contain sizing preserves the full image rectangle and its proportions. Transparent source pixels are composited onto the chosen background in the PNG.
Is 3:4 the same as 4:5?
No. At 1,080 pixels wide, 3:4 is 1,440 pixels tall and 4:5 is 1,350 pixels tall. Converting a 3:4 image to 4:5 by cropping removes 6.25% of its area.
Will this predict a social profile grid?
No. This compares exported file shapes. Feed display, carousel behavior, profile thumbnails and publishing APIs may crop differently. Platform acceptance of these templates is not asserted here.
How do batch downloads work?
Choose the batch padding ratio, update previews and prepare the batch. The tool processes one file at a time and creates a separate PNG download link for each image; it does not create a ZIP.
Which files and sizes can I use?
Use up to 20 JPEG, PNG or WebP files, each at most 30 MB, 40 million decoded pixels and 20,000 pixels on either side. Animated images are treated as a still. Output resizing can enlarge small originals; it cannot recover detail.

Sources

Last reviewed 2026-11-14; next review due by 2027-02-12. The method is written out above so you can check our math.