Viewfinder · ground glass · etched gate
Aspect Ratio Calculator
Type a width and a height and the gate is etched onto the screen at that ratio. Lock the ratio to resize without distortion, pick a preset, and read the common sizes and the CSS off the panel.
Aspect ratio, without the distortion
An aspect ratio is the shape of a frame: width to height, reduced to its smallest whole numbers. 1920 by 1080 is 16:9, and so is 1280 by 720, which is why a video made at one plays at the other without stretching. Resizing keeps the ratio when both sides are scaled by the same factor; this page does that arithmetic and shows the resulting frame etched on the viewfinder screen so you can see the shape, not just the numbers.
The panel
With the ratio locked, changing one dimension recalculates the other. Presets etch the common gates: 16:9 for screens, 4:3 for older video and tablets, 3:2 for photographs, 9:16 for vertical video, 21:9 and 2.39:1 for widescreen film. The CSS line is the modern aspect-ratio property; the padding-top line is the older trick for browsers that lack it, a percentage of the width that yields the right height.
Why a viewfinder
A camera's focusing screen is a ground-glass plate with lines etched into it: a grid for the horizon, and bracket marks showing the limits of a film format. Cameras that shot several formats had masks that changed those marks. The screen above works the same way: the etched gate is the ratio, the shaded area outside it is what the format would crop away.
How do I calculate a ratio by hand?
Divide both numbers by their greatest common divisor. 1920 and 1080 share 120, giving 16 and 9. For odd sizes the reduced form can be unwieldy (1366 by 768 reduces to 683:384), so the decimal, 1.78, is often the more useful figure.
What is 2.39:1?
The anamorphic widescreen ratio used by most feature films, sometimes written 2.35:1 or 2.40:1. On a 16:9 screen it shows as letterboxed bars top and bottom.
Is anything uploaded?
No. It is arithmetic in your browser; no image is involved.