Aspect Ratio Calculator
Fill in any two of ratio, width and height — the third is calculated as you type. Everything runs in your browser; nothing is uploaded.
Nearest standard resolutions
How it works
An aspect ratio is just the width of a rectangle divided by its height, written as two numbers separated by a colon. A 1920 × 1080 image and a 3840 × 2160 image are different sizes but the same shape: both are 16:9. Everything on this page follows from three small pieces of arithmetic.
1. Reducing to lowest terms
To turn a pixel size into a ratio, both numbers are divided by their greatest common divisor (GCD), found with the Euclidean algorithm. For 1920 × 1080 the GCD is 120, so the ratio reduces to 16:9 — not 1920:1080. For 1080 × 1920 the GCD is also 120, giving 9:16. If you type a decimal such as 2.39, both sides are multiplied by 1000 first, so 2.39:1 becomes 2390:1000 and reduces to 239:100.
2. Snapping near-misses to a standard ratio
Real-world sizes are often almost a standard shape. A 1366 × 768 laptop panel reduces to 683:384, which is technically correct and completely useless. The calculator checks whether the reduced ratio has a term larger than 32; if it does, it compares the decimal ratio against a table of standard ratios (16:9, 4:3, 3:2, 16:10, 21:9, 64:27, 1.85:1, 2.39:1 and others). If one of them is within 0.5%, the calculator shows that standard ratio instead and prints a note telling you the exact reduction and how far off it was. Nothing is hidden: 1000 × 333 is reported as 3:1 with a note saying the exact reduction is 1000:333, within 0.1%.
3. Scaling to a new size
With the ratio locked, changing one dimension multiplies through: height = width × (ratio height ÷ ratio width), and width = height × (ratio width ÷ ratio height). With the lock switched off, the two pixel fields are treated as the source of truth and the ratio is recalculated from them instead.
Rounding rule
Pixels are whole numbers, so every computed dimension is rounded to the nearest integer (exact halves round up), and a result that would round to zero is clamped to 1. This means a round trip is not always lossless: 1000 px at 16:9 gives 563 px (562.5 rounded up), and 563 px back at 16:9 gives 1001 px. When you need an exact pair, pick a width that is a multiple of the ratio width — for 16:9, any multiple of 16 gives a whole-number height.
The "nearest standard resolutions" list
For the current ratio the calculator searches a catalogue of just under 50 real-world resolutions. Sizes with exactly the same reduced ratio are listed plainly; sizes within 2.5% are listed with a ≈ and the exact percentage error, which is how you discover that a monitor sold as "21:9" is really 64:27 (2560 × 1080) or 43:18 (3440 × 1440). If fewer than six catalogued sizes match, the list is topped up with exact integer multiples of your ratio, preferring long edges like 1920 and 3840.
Worked examples
Example 1 — Resizing a hero image without distortion
You have a photo at 4032 × 3024 from a phone camera and need it to fit a 1200 px wide slot. Type 4032 and 3024 into the pixel fields with the lock off: the ratio reads 4:3 (GCD 1008). Switch the lock on, change the width to 1200, and the height becomes 900. Exporting at 1200 × 900 keeps the framing identical; exporting at 1200 × 800 would squash it by 12.5% or force a crop.
Example 2 — A 21:9 banner at a fixed height
A page design gives you a 1080 px tall header strip and asks for an ultrawide feel. Click the 21:9 preset, then type 1080 into the height field with the lock on. The width computes to 2520 px. The resolution list then shows the honest complication: no shipping monitor is exactly 21:9. It offers 2560 × 1080 (≈ 1.59% off, really 64:27) and 3440 × 1440 (≈ 2.38% off, really 43:18). If the banner must fill a real ultrawide screen edge to edge, design at 2560 × 1080 rather than 2520 × 1080.
Example 3 — Turning an awkward crop into a sane ratio
A cropped screenshot measures 1000 × 333. Entered with the lock off, the exact reduction is 1000:333 — a fraction nobody can use. Because 333 exceeds the "ugly term" threshold, the calculator compares 3.003 against the standard table, finds 3:1 within 0.1%, and displays 3:1 with a note explaining the snap. Now you can generate clean sizes: the list offers 1920 × 640 and 3840 × 1280, both exactly 3:1. Re-cropping to 1920 × 640 loses three pixels of height and gains a ratio you can reproduce forever.
Example 4 — Checking whether a video will letterbox
A client sends a 1440 × 1080 file and wants it on a 16:9 display. Enter 1440 × 1080: the ratio is 4:3 (1.333:1), not 1.778:1. On a 16:9 screen it will pillarbox with black bars down both sides. To find how wide a true 16:9 frame of the same height would be, click 16:9 with the lock on and 1080 in the height field: 1920 px. The 480 px difference is the total width of the two bars — 240 px each side.
Frequently asked questions
Why does 1920 × 1080 show as 16:9 instead of 1920:1080?
Because both numbers share a greatest common divisor of 120. Dividing through gives 16:9, the lowest-terms form. Ratios are conventionally written in lowest terms so that different sizes of the same shape are instantly recognisable as equivalent: 1280 × 720, 1920 × 1080 and 3840 × 2160 are all 16:9.
What is the difference between aspect ratio and resolution?
Resolution is a count of pixels — how much detail there is. Aspect ratio is a shape — the proportion of width to height. 1280 × 720 and 3840 × 2160 have the same ratio but nine times the pixel count difference. Changing resolution while keeping the ratio makes an image bigger or smaller; changing the ratio without cropping makes it distorted.
Is 21:9 a real aspect ratio?
Not literally. "21:9" is a marketing label for ultrawide displays. The panels themselves are 64:27 (2560 × 1080 and 5120 × 2160, exactly 2.370:1) or 43:18 (3440 × 1440, 2.389:1), while true 21:9 is 2.333:1. The gap is 1.6–2.4% — small enough to be invisible on a photo, large enough to shift a logo or subtitle off the edge of a full-bleed layout. This calculator will happily compute exact 21:9 sizes, but the resolution list always shows you the real panel sizes alongside.
Why doesn't my height come back to the same number when I convert twice?
Rounding. Pixels are integers, so 1000 px at 16:9 becomes 562.5 px, which rounds to 563. Going back the other way, 563 px at 16:9 is 1000.9 px, which rounds to 1001. The drift is never more than one pixel per conversion, but it compounds if you chain many resizes. Work from the original dimensions each time rather than from the last result, or choose a width that is a multiple of the ratio's width term.
What ratio should I use for a website hero image?
There is no single answer, because the browser window is the real constraint. Common choices are 16:9 for a cinematic banner, 3:1 or 21:9 for a slim strip, and 4:5 or 1:1 for a mobile-first block. The practical technique is to design at the widest ratio you support, keep all essential content inside a centred "safe area" matching the narrowest ratio you support, and let CSS object-fit: cover crop the difference. Use the calculator to check that both extremes share a workable height.
Does changing aspect ratio reduce quality?
Changing the ratio by cropping discards pixels but keeps everything that remains pixel-perfect. Changing it by stretching preserves every pixel but distorts geometry — faces widen, circles become ellipses — and is almost never acceptable. Changing it by padding (letterboxing or pillarboxing) preserves the image and adds bars. Scaling down within the same ratio is generally safe; scaling up cannot invent detail and softens the image.
How do I handle non-integer ratios like 2.39:1?
Type the decimal straight into the ratio width field with 1 in the ratio height field. The calculator multiplies both by 1000 and reduces, giving 239:100. Cinema scope is a good example: a 2.39:1 delivery at 1080 px tall is 2581 px wide, and at 4096 px wide it is 1714 px tall. DCI 4K containers usually store scope footage as 4096 × 1716 to keep the height even, which is why professional specs round to even numbers rather than to the mathematically nearest pixel.
Why should width and height be even numbers for video?
Most video codecs (H.264, H.265, VP9, AV1) encode colour information at half resolution horizontally and vertically — this is 4:2:0 chroma subsampling. An odd dimension cannot be halved cleanly, so encoders either refuse the file or silently pad it. If you are producing video rather than stills, round the calculator's output to the nearest even number, and to a multiple of 4 or 16 if your encoder complains about macroblock alignment.
Does the calculator send my numbers anywhere?
No. The entire calculation runs in JavaScript in your browser, and the numbers you enter are never uploaded or transmitted — there is no server call to make, because there is no server behind the calculator. It keeps working with the network disconnected, and works if you save it to disk and open it offline.
Use cases & limitations
Where this tool helps
- Design handoff. Confirm that a mockup drawn at 1440 px wide scales to a 375 px phone without fractional heights.
- Video export settings. Work out the exact frame size for a vertical cut of a horizontal edit, or the size of the letterbox bars a ratio change will produce.
- Print and canvas sizing. Ratios are unit-agnostic. Enter 24 and 36 to confirm a poster is 2:3, then find the pixel size you need at a chosen DPI.
- CSS layout. Get the number to put in
aspect-ratio: 16 / 9, or the percentage for the older padding-top trick — for 16:9 that is 56.25%, which is 9 ÷ 16. - Ad and thumbnail specs. Check whether a platform's stated pixel size matches the ratio it claims. They disagree more often than you would expect.
- Photo cropping. Decide between 3:2 (native to most DSLRs), 4:3 (most phone sensors and Micro Four Thirds) and 1:1 before you crop, rather than after.
Limitations you should know about
- It only knows shape, not pixels. The calculator cannot tell you whether an image has enough resolution for a given output — a 16:9 image at 320 × 180 and one at 3840 × 2160 look identical to it.
- Snapping is a convenience, not a fact. When the calculator snaps 683:384 to 16:9 it is making an editorial judgement that 0.05% does not matter. If you are doing pixel-exact compositing, read the note and use the exact reduction.
- Non-square pixels are out of scope. Legacy formats such as DVD PAL (720 × 576 displayed at 16:9) use anamorphic, non-square pixels, so the storage ratio and the display ratio differ. This tool assumes square pixels throughout.
- Safe areas are not modelled. Knowing a TikTok video is 9:16 does not tell you that the bottom fifth is covered by the caption and buttons. Platform pages on this site describe those margins in words; the calculator itself only knows the frame.
- Platform specs change. Recommended upload sizes shift as apps update. Ratios are far more stable than pixel counts, so where a platform page states a ratio, trust it more than the exact number.
- Rounding is per-operation. Chaining resize after resize accumulates up to one pixel of drift each time. Always recompute from the original.