apprun.icuGuides

Guide · Design

Resize an image without stretching: aspect ratios explained

Preserve width ÷ height when resizing. For a 1920 × 1080 source, a new width of 1280 gives a height of 720. A different target shape requires a crop or margins if you want to avoid stretching.

By Yunus Emre VurgunUpdated Read 3 minIncludes a working browser tool
On this page
  1. The short answer
  2. Separate shape from size
  3. Calculate the missing dimension
  4. Choose fit when the whole image matters
  5. Choose crop when the frame must be filled
  6. Recognize accidental distortion
  7. Connect the result to the final medium
  8. Common questions
  9. Sources and further reading
1920 × 1080 → Scale × ⅔ → 1280 × 7201920 × 1080Scale × ⅔1280 × 720
1920 × 1080 → Scale × ⅔ → 1280 × 720. Follow the units and the representation at each step.

Separate shape from size

An aspect ratio describes shape. Divide width by height or reduce the two whole-number dimensions by their greatest common divisor. For 1920 and 1080, dividing both by 120 gives 16:9. A 3840 × 2160 image has the same ratio but four times the pixel count.

A ratio does not describe sharpness, file size, color quality or compression artifacts. Two images can share the same dimensions while having very different quality. Keep the shape calculation separate from the decision about how many pixels the final use needs.

Calculate the missing dimension

To preserve shape when you choose a new width, multiply original height by new width and divide by original width. For a 1920 × 1080 source at 1280 pixels wide, the height is 1080 × 1280 ÷ 1920 = 720 pixels.

Round only the final pixel dimension. Repeatedly rounding intermediate scales can accumulate small errors. Some video codecs or production workflows require even dimensions or a particular frame size, so check the destination’s requirements after calculating the proportional result.

Try it with your own input

Your result

Choose fit when the whole image matters

A fit operation shows the whole source inside a target frame. If the shapes differ, the remaining area becomes empty margins or letterboxing. For a document scan, diagram or screenshot containing important edge content, keeping all of the image may be the right tradeoff.

In CSS, object-fit: contain is a common way to express this behavior. The visible margins are not an error; they are the space left after preserving the source ratio. Choose a deliberate background color and check whether the frame is still useful on a narrow screen.

Choose crop when the frame must be filled

A crop fills the target frame while discarding some source area. Moving a wide landscape photo into a square frame typically removes content from its sides. Changing the focal point can keep a face or important object in view.

In CSS, object-fit: cover describes this kind of filling behavior. Test the actual image and its focal point at each relevant size. A fixed crop that works on desktop can remove the subject on a phone. Avoid assuming that a centered crop is always acceptable for text, product details or diagrams.

Recognize accidental distortion

Stretching sets width and height independently. A circle becomes an ellipse, faces change proportion and a screenshot can make type look unnaturally wide. If that effect is not intentional, preserve the original ratio or choose a crop instead.

For a quick check, compare the target width-to-height ratio with the source. A difference means a proportional resize cannot both fill the frame and preserve every pixel of content. The Percentage Calculator can compare the scale change, but it cannot decide which content is safe to crop.

Connect the result to the final medium

A print adds a physical dimension to the problem. First choose the crop and ratio, then calculate the pixels required for the final inches and PPI. Cropping reduces the available pixel count, so calculate print size from the cropped result rather than the original file.

The print-size guide carries the calculation through. For a web graphic, also check text contrast with the contrast tool and export at an appropriate size. Shape, readability and pixel density each need their own check.

Common questions

Are 1920 × 1080 and 1280 × 720 the same ratio?

Yes. Both reduce to 16:9.

Can resizing fill a different shape without cropping?

Only by adding margins or stretching. Proportional resizing alone cannot preserve everything and fill a differently shaped frame.

Why is the calculated height rounded?

Pixel dimensions are whole numbers. The tool rounds the final calculated height.

Does a larger pixel count guarantee quality?

No. Source detail, focus, compression and processing also matter.

Should I crop before calculating print size?

Yes. Use the remaining pixel dimensions after the final crop.

Sources and further reading

Share this guide