Aspect Ratio Calculator

Understanding Aspect Ratios

An aspect ratio is the proportional relationship between an image or video's width and its height, written as two numbers separated by a colon. 16:9 means for every 16 pixels of width there are 9 pixels of height. Aspect ratios are dimensionless — 1920×1080 and 1280×720 are both 16:9 because they share the same proportion.

Common Ratios and Their Uses

• 16:9 (1.78:1) — The universal standard for widescreen video: YouTube, Netflix, Vimeo, Twitch, TV broadcasts, desktop monitors, laptop screens.
• 4:3 (1.33:1) — Legacy TV and monitor standard. Still used for presentations, some iPad apps, standard-definition video.
• 1:1 — Square format. Instagram feed, profile photos, album art. Strong visual impact, equally wide and tall.
• 9:16 (0.56:1) — Vertical video for TikTok, Instagram Reels and Stories, YouTube Shorts. The "mobile full screen" format.
• 4:5 (0.8:1) — Instagram portrait feed posts. Taller than square, shows more content without going fully vertical.
• 21:9 (2.33:1) — Cinematic ultrawide. Used in cinema (2.39:1 scope format) and ultrawide monitors.
• 3:2 (1.5:1) — Traditional 35mm film photography and many digital cameras. Standard print photo proportions.

How to Maintain Aspect Ratio When Resizing

To scale an image while preserving its ratio, multiply both dimensions by the same scale factor. To find a proportional height for a new width: new height = (new width / original width) × original height.

Example: Scale 1920×1080 to a 1280-pixel wide version: 1080 × (1280 / 1920) = 1080 × 0.667 = 720 pixels. The result, 1280×720, maintains the 16:9 ratio.

CSS aspect-ratio Property

The CSS aspect-ratio property (supported in all modern browsers since 2021) lets you declare an element's intended ratio without knowing both dimensions. Setting aspect-ratio: 16 / 9 on a container and giving it only a width causes the browser to calculate the correct height automatically. This replaces older padding-percentage hack techniques.

Frequently Asked Questions

• What is an aspect ratio?
  An aspect ratio describes the proportional relationship between an image or video's width and height, expressed as two numbers (e.g., 16:9). A 16:9 ratio means the width is 16 units for every 9 units of height.
• What is the standard YouTube video aspect ratio?
  YouTube's standard ratio is 16:9. Recommended resolution: 1920×1080 (Full HD). Thumbnails should be 1280×720 minimum or 1920×1080 recommended.
• What aspect ratio does Instagram use?
  Instagram supports 1:1 (square, 1080×1080), 4:5 (portrait feed, 1080×1350), and 9:16 (Stories/Reels, 1080×1920).
• How do I maintain aspect ratio when resizing?
  New height = (new width / original width) × original height. For CSS, use aspect-ratio: 16 / 9 and set only one dimension — the browser calculates the other automatically.
• What is 16:9 in pixels?
  Common 16:9 resolutions: 1280×720 (HD), 1920×1080 (Full HD), 2560×1440 (QHD), 3840×2160 (4K UHD), 7680×4320 (8K UHD). Any dimensions where width ÷ height = 1.778 are 16:9.
• What does CSS aspect-ratio do?
  The CSS aspect-ratio property declares an element's preferred ratio. Setting aspect-ratio: 16 / 9 and only a width causes the browser to calculate the height automatically. Supported in all modern browsers since 2021.