Aspect Ratios Explained for Beginners

"Aspect ratio" sounds technical, but it describes something you already understand: the shape of an image. Not how many pixels it has, not how big the file is, just whether it's square, tall or wide, and by how much. Once that clicks, choosing the right crop stops being guesswork.

What the numbers mean

An aspect ratio is written as width : height. It's the relationship between the two sides, reduced to its simplest form.

• 1:1, the width equals the height. A perfect square.
• 4:5, for every 4 units across, there are 5 units down. Slightly taller than it is wide (portrait).
• 16:9: for every 16 units across, 9 down. Much wider than tall (landscape).

The key idea: a ratio has no fixed size. A 16:9 image can be 1600×900 or 3840×2160: both are 16:9 because dividing width by height gives the same number (about 1.78). The shape is identical. Only the resolution changes.

A mental shortcut

Divide width by height and you get a single number:

• Less than 1 → portrait (taller than wide). 4:5 = 0.8.
• Exactly 1 → square. 1:1 = 1.0.
• Greater than 1 → landscape (wider than tall). 16:9 = 1.78.

That one number tells you the orientation at a glance. It's also how a crop tool locks a box to a ratio: it just keeps width ÷ height constant while you drag.

The ratios you'll actually use

Ratio	Shape	Common use
1:1	Square	Profile pictures, product grids, avatars
4:5	Tall portrait	Social feed posts, magazine-style images
3:2	Mild landscape	Classic camera photos, prints
16:9	Wide landscape	Video thumbnails, banners, presentations
9:16	Tall portrait	Phone Stories and short-form video

You don't need to memorise these. You just need to know that a shape exists for the place your image is going, and to crop to that shape rather than fighting it later.

Cropping vs. resizing. Not the same thing

Beginners often confuse the two:

• Cropping changes the shape and framing by cutting pixels away from the edges. The pixels you keep are untouched.
• Resizing changes the dimensions by scaling every pixel up or down, keeping the same shape.

If a photo is the wrong shape, you crop. If it's the right shape but too big, you resize. Sometimes you do both, in that order.

"The pixels you keep are untouched" isn't a figure of speech, and since I wrote the crop tool I can tell you why it's literally true. Cropping copies your selected rectangle onto a canvas of exactly the same width and height: one source pixel to one destination pixel, no scaling step, so no resampling maths ever runs. Resizing is the opposite: our resizer hands the image to pica for Lanczos resampling, which invents new pixel values by weighing the neighbours. Both are the right tool in their place, but only one of them is lossless in the geometric sense, and it's the crop.

Two small behaviours in the same code that explain results people find surprising. The crop rectangle is clamped to the image bounds, so dragging a selection off the edge can't produce a band of empty pixels, the box just stops. And if you crop to a format with no alpha channel, JPEG being the obvious one, the canvas is flooded with white first, so a transparent PNG cropped to JPG comes out on a white background rather than a black one. That's a deliberate choice, not an accident of the format.

Try it in two minutes

The easiest way to feel how ratios work is to play with one. Open the crop image tool, drop in any photo, and click between the 1:1, 4:5 and 16:9 presets. Watch the box snap to each shape while the rest of the image dims. The live readout shows the exact width and height in pixels, so you can see the ratio holding steady as you drag.

A few things to notice while you experiment:

• The locked box refuses to become any other shape, no matter how you pull it.
• Switching to Free lets you break the lock and crop to anything.
• A tighter crop keeps fewer pixels, which usually means a smaller file too.

Five minutes of dragging a locked box around teaches this better than any diagram, mine included. Once the shape makes sense, the two questions that naturally follow are how many pixels and how does that print: both covered in pixels, DPI and aspect ratio explained. And when you want the exact shape a particular platform expects rather than the general principle, the best image sizes for every social platform is the lookup table; cropping the perfect profile picture is the 1:1 case in detail.

Sources

• Aspect ratio (image) (Wikipedia)
• �2� (MDN Web Docs): the source-rectangle copy behind cropping
• pica, the Lanczos resampler used when you resize instead