Aspect ratio calculator
Find the aspect ratio of an image or screen (16:9, 4:3…), compute a new size without distortion and get the CSS aspect-ratio code.
- Free
- No sign-up
- No file uploaded
- Windows, Mac, Android, iPhone
Loading the tool…
About this tool
Find the exact format of an image, a video or a screen: simplified ratio (16:9, 4:3, 21:9…), closest common ratio and decimal value. Compute a new size without distortion, browse common resolutions with the same ratio, and copy the CSS aspect-ratio code, its legacy version or Tailwind.
When to use it
Prepare a video or a thumbnail
YouTube expects 16:9, a story 9:16, an Instagram post 1:1 or 4:5: check the format before exporting.
Resize an image proportionally
You want a 1200 px width: the correct height is computed instantly.
Embed a responsive video
aspect-ratio: 16 / 9 on a YouTube iframe keeps the right format at every screen width.
How to use
- Enter the width and height (or pick a ratio).
- Read the simplified ratio and the closest common ratio.
- Enter a new width or height to get the other dimension.
How it works
The ratio is simplified with Euclid's algorithm (greatest common divisor). It is then compared with common ratios: if the difference is under 2%, the closest common ratio is shown.
The new dimension is rounded to the nearest pixel. The legacy method (percentage padding-top) is still provided for browsers that don't know aspect-ratio.
Tips for best results
- Prefer even dimensions for video: many encoders require them.
- For the web, a 1600 to 2000 px wide image is enough in most cases.
- aspect-ratio prevents layout shifts on load: use it for all embedded videos and images.
- To change the ratio, crop rather than stretch: a distorted image is noticed immediately.
Common problems and fixes
The ratio looks odd (683:384)
The size doesn't match a common ratio exactly; the tool then shows the closest common ratio.
My image is distorted after resizing
The new size doesn't have the same ratio: use the computed dimension, or crop the image with “Resize image”.
aspect-ratio has no effect
It is ignored when both width and height are set. Leave the height on auto.
Frequently asked questions
How is a ratio calculated?
Width and height are divided by their greatest common divisor: 1920 × 1080 gives 16:9. The tool does it automatically.
Why does 1366 × 768 give 683:384?
That resolution isn't exactly 16:9. The tool shows the exact ratio and the closest common ratio (about 16:9).
How do I resize without distortion?
Enter the new width: the height is computed to keep the same ratio (and vice versa).
What is CSS aspect-ratio for?
The property reserves space for a video or image before it loads, with no calculation or padding trick: the page no longer jumps.
Related searches
Still stuck?
Ask on the forum: the category, the tool, your device sheet and the test result will be filled in for you.