Framing experiment

Crop Geometry: How Much of a Product Image Can a Thumbnail Remove?

Use transparent calculations and controlled frames to see what centered 1:1, 4:3 and 3:4 crops remove from the same source.

Published by Seller Operations Lab, the responsible editorial project.

Last checked September 22, 2026

REPRODUCIBLE METHOD

What this test can tell you

Question: What content is removed when one image is shown in different aspect ratios?
Method: Render the same prepared image into centered square, landscape and portrait canvases. Calculate the retained source rectangle before checking the visual result.
Result: For a 2000 × 2000 square, a centered 4:3 crop removes 250 pixels from the top and bottom, while a centered 3:4 crop removes 250 pixels from each side. The calculation changes with every source ratio.
Limitation: These frames illustrate geometry only. A real storefront may use a different crop position, focal point or responsive container.
Environment: Deterministic aspect-ratio calculations using a 2000 × 2000 source and centered frames. The calculations are independent of a marketplace UI; the visual preview still needs a browser check.

Recorded values or calculations

Item	Value	Basis
4:3 frame	2000 × 1500; 250 px removed from top and bottom	2000 − 1500 = 500 total vertical pixels
3:4 frame	1500 × 2000; 250 px removed from left and right	2000 − 1500 = 500 total horizontal pixels
1:1 frame	2000 × 2000; no crop on a square source	Same source and output aspect ratio

Reproduce it

Start with a square test image and mark its four edges.
Render centered 4:3 and 3:4 frames at the same scale.
Compare the calculated removed pixels with the visible preview.
Repeat with a non-square source before applying the result to a listing.

The geometry

A centered crop keeps the smaller dimension and trims the larger one. On a 2000 × 2000 source, a 4:3 frame is 2000 × 1500, so 500 vertical pixels are removed in total. A 3:4 frame is 1500 × 2000, so 500 horizontal pixels are removed in total.

Those pixels are not inherently unimportant. A handle, label or accessory near the edge can be more valuable than empty background in the center.

The visual check

Use a crop preview after preparing the image, then inspect it at approximately the size a customer will see. A centered crop is useful for identifying risk, not for claiming that a marketplace uses the same frame.

Mark the full product boundary before choosing a crop.
Compare square, landscape and portrait frames.
Move the source composition or add margin when a meaningful edge is clipped.
Verify the final listing preview after upload.

Sources checked

MDN: CanvasRenderingContext2D.drawImage() · MDN Web Docs

The geometry

The visual check

Sources checked

Continue with a related check