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
- 1Enter the width and height of your image or video.
- 2The aspect ratio and simplified fraction are shown instantly.
- 3Or pick a preset ratio and enter one dimension to calculate the other.
- 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.
Related Tools
JSON Formatter & ValidatorFormat, validate, and beautify JSON data with syntax highlighting and error detection.
JWT DecoderDecode and inspect JWT tokens. View header, payload, and verify signatures.
Base64 Encode/DecodeEncode text to Base64 or decode Base64 back to text. Supports UTF-8 and binary data.
URL Encode/DecodeEncode or decode URL components. Handle special characters, query strings, and full URLs.
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.