Aspect Ratio Calculator Online — 16:9, 4:3, 1:1 Guide

What Is an Aspect Ratio?

An aspect ratio is the proportional relationship between the width and height of a rectangular object — typically expressed as W:H. A 16:9 rectangle is 16 units wide for every 9 units tall. The actual pixel dimensions can be anything (1280×720, 1920×1080, 3840×2160) as long as they maintain the same proportion.

Aspect ratios govern screens, sensors, films, and canvases. The 16:9 ratio was standardized for HDTV in the 1980s after analysis showed it was the best compromise between the 4:3 standard TV ratio and the wider cinema formats (2.35:1, 2.39:1). Today, 16:9 is universal for computer monitors, televisions, and most video platforms.

Understanding aspect ratios is essential when:

• Resizing images without stretching or squashing them
• Preparing video for a specific platform (YouTube, TikTok, Instagram)
• Building responsive layouts with correct proportions
• Ordering prints or specifying canvas dimensions for art and photography
• Cropping images to fit a required ratio (profile photos, OG images)

How to Use the Aspect Ratio Calculator

1. Open the Aspect Ratio Calculator
2. Click a preset (16:9, 4:3, etc.) or enter a custom ratio in the W:H fields
3. Enter the width — the height is calculated automatically
4. Or enter the height — the width is calculated automatically
5. The Detected ratio shows the simplified ratio for any custom dimensions you enter
6. Click Copy to copy the result to your clipboard

Common Aspect Ratios

Platform-Specific Requirements

YouTube

All YouTube videos should use 16:9. The minimum recommended resolution is 1280×720 (720p). For the best quality across all devices: 1920×1080 (1080p) or 3840×2160 (4K). Vertical 9:16 content is supported as YouTube Shorts (1080×1920) and displays in a separate feed from regular uploads.

YouTube thumbnails should be 1280×720 (16:9) at minimum 2MB. Using 1920×1080 is recommended for future-proofing. The thumbnail file size limit is 2MB.

Instagram

Instagram supports three ratios for feed posts:

• Square 1:1 (1080×1080) — most reliable; shows fully without cropping in all contexts
• Portrait 4:5 (1080×1350) — maximizes vertical feed space; most engaging in the scroll
• Landscape 1.91:1 (1080×566) — widest; limited vertical space

Reels and Stories use 9:16 (1080×1920). Uploading the wrong ratio results in platform-side cropping, so calculate dimensions before exporting.

Open Graph / Social Sharing

Facebook, LinkedIn, and WhatsApp preview images use approximately 1.91:1 (1200×628px). Twitter card images: summary cards use 2:1 (1200×600px) or 1:1 (1200×1200px). Using the correct ratio prevents ugly cropping when your URL is shared.

Photography prints

Standard print sizes map to specific aspect ratios. Mismatching the sensor ratio to the print ratio causes cropping or white borders:

Maintaining Aspect Ratio in CSS

The aspect-ratio property (modern, all browsers)

.video-container {
  width: 100%;
  aspect-ratio: 16 / 9;
  background: #000;
}

.square-card {
  width: 300px;
  aspect-ratio: 1;
}

Supported in all modern browsers since 2021 (Chrome 88, Firefox 89, Safari 15, Edge 88). The simplest and most readable approach. The aspect-ratio: 1 shorthand is equivalent to 1 / 1.

The padding-top hack (legacy browsers)

.video-wrapper {
  position: relative;
  padding-top: 56.25%; /* 9/16 × 100% = 56.25% */
}
.video-wrapper iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

Padding percentages in CSS are relative to the width of the containing block — not the element's own height. This means padding-top: 56.25% creates a height that is exactly 56.25% of the element's width, which is 9/16 — maintaining the 16:9 ratio. Common padding values:

• 16:9 → padding-top: 56.25%
• 4:3 → padding-top: 75%
• 1:1 → padding-top: 100%
• 21:9 → padding-top: 42.86%

object-fit for images

When displaying an image in a container with a fixed aspect ratio, useobject-fit: cover to fill the container without distortion (cropping if necessary), or object-fit: contain to show the full image with letterboxing:

.card-image {
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  object-position: center;
}

Calculating Aspect Ratios Manually

The formulas:

• Find height from width: Height = Width × (H ÷ W) — for 16:9 and width 1280: 1280 × (9 ÷ 16) = 720
• Find width from height: Width = Height × (W ÷ H) — for 16:9 and height 720: 720 × (16 ÷ 9) = 1280
• Simplify a ratio: Divide both dimensions by their GCD. 1920 and 1080 share GCD 120: 1920÷120 = 16, 1080÷120 = 9 → 16:9

Common Questions

What does the “detected ratio” in the tool mean?

When you enter width and height values, the tool divides both by their greatest common divisor to find the simplest equivalent ratio. For example, 1920×1080 reduces to 16:9 (dividing both by 120). This is the canonical ratio for those dimensions.

How do I calculate the height for a 16:9 image that is 800px wide?

Height = Width × (9 ÷ 16) = 800 × 0.5625 = 450px. Or select the 16:9 preset in the calculator, enter 800 in the width field, and the height updates to 450 automatically.

What aspect ratio should I use for a Facebook cover photo?

Facebook cover photos display at 820×312px on desktop and 640×360px on mobile — two different aspect ratios. The safe approach: use a 2.63:1 ratio (820×312) and center your important content, allowing room to be cropped on mobile.