ZenovayTools

Aspect Ratio Calculator

Calculate image and video aspect ratios. Enter any two values to find the third, or pick a preset ratio for common video and social media sizes.

Common ratios:

Aspect Ratio

16:9

Decimal

1.7778

Total Pixels

2,073,600

2.07 MP

16:9

CSS

aspect-ratio: 16 / 9;

Common 16:9 Resolutions

480p854 × 480
720p HD1280 × 720
1080p FHD1920 × 1080
1440p QHD2560 × 1440
4K UHD3840 × 2160

How to Use Aspect Ratio Calculator

  1. 1Enter the width and height of your image or video.
  2. 2The aspect ratio and simplified fraction are shown instantly.
  3. 3Or pick a preset ratio and enter one dimension to calculate the other.
  4. 4View common resolutions for the selected ratio.
Zenovay

Privacy-first analytics for your website

Understand your visitors without invasive tracking. GDPR compliant, lightweight, and powerful.

Explore Zenovay

Frequently Asked Questions

What is an aspect ratio?
An aspect ratio is the proportional relationship between an image or video's width and height, expressed as W:H. For example, 16:9 means for every 16 units of width there are 9 units of height. Common ratios: 16:9 (widescreen HD video, YouTube), 4:3 (older TV/monitor, iPad landscape), 1:1 (square, Instagram), 9:16 (vertical video, TikTok/Reels), 3:2 (DSLR photos, 35mm film), 21:9 (ultrawide cinema).
Why do aspect ratios matter for web and video?
Aspect ratios matter for: (1) Video embeds — using the wrong ratio causes letterboxing or stretching. (2) Image optimization — crop images to the exact display ratio before uploading to avoid browser-side cropping. (3) CSS — setting aspect-ratio: 16/9 on a container ensures it always maintains its proportions regardless of width. (4) Social media — each platform has different required ratios for optimal display (Twitter: 16:9 or 1:1, Instagram: 1:1, 4:5, or 9:16).
How do I maintain aspect ratio in CSS?
Modern CSS: aspect-ratio: 16 / 9 on the element directly. The element's height will automatically match its width at the given ratio. Legacy method (padding hack): set height: 0 and padding-bottom: 56.25% on a container (56.25% = 9/16 × 100%) — this works in older browsers. For responsive videos, wrap in a div with aspect-ratio: 16/9 and set the iframe/video to width: 100%; height: 100%.
What resolution should I use for different aspect ratios?
16:9 — 1280×720 (720p HD), 1920×1080 (1080p Full HD), 3840×2160 (4K UHD), 2560×1440 (2K QHD). 4:3 — 1024×768, 1280×960, 800×600. 1:1 — 1080×1080 (Instagram). 9:16 — 1080×1920 (Stories/Reels/TikTok). 3:2 — 1920×1280, 2400×1600. 21:9 — 3440×1440, 2560×1080. For web images, serve at 2× the CSS display size for retina displays.
How do I calculate a missing dimension?
If you know the width (W) and the aspect ratio (W_ratio:H_ratio), the height is: H = W × (H_ratio / W_ratio). For example, 1920px wide at 16:9 → H = 1920 × (9/16) = 1080px. If you know the height, the width is: W = H × (W_ratio / H_ratio). This calculator handles all these calculations automatically — just enter any two values.