Aspect Ratio Calculator

An aspect ratio defines the proportional relationship between the width and height of a rectangle. It is typically written as W:H where W and H are the smallest whole numbers representing the proportion. For example, a 1920×1080 display has a 16:9 ratio because both dimensions share a common factor of 120.

Aspect ratios are essential in design, photography, videography, and web development. They determine how content appears on different screens, how images crop, and how video letterboxing works. Understanding ratios helps ensure your visual content displays correctly across devices and platforms.

16:9 — The universal widescreen standard for monitors, TVs, and online video. Used by YouTube, Netflix, and virtually all modern displays. Resolutions include 1280×720 (HD), 1920×1080 (Full HD), 2560×1440 (QHD), and 3840×2160 (4K UHD).

4:3 — The classic standard for CRT televisions and early computer monitors. Still used in presentations (PowerPoint defaults) and some iPad models. Common resolution: 1024×768.

21:9 — Ultrawide cinema format used in movie theaters and ultrawide monitors. Provides an immersive experience for films and gaming. Common resolution: 2560×1080 or 3440×1440.

1:1 — Square format, popular on Instagram and other social platforms. Used for album art, profile pictures, and thumbnails. Common resolution: 1080×1080.

9:16 — Vertical video format for mobile content like TikTok, Instagram Reels, YouTube Shorts, and Snapchat. Common resolution: 1080×1920.

CSS now supports the aspect-ratio property, allowing developers to set intrinsic ratios on elements without padding hacks. The syntax is simple: aspect-ratio: 16 / 9. This is widely supported in modern browsers and works with responsive layouts.

Open Graph (OG) images used for social media link previews are recommended at 1200×630 pixels (approximately 1.91:1). Twitter cards use 2:1 for summary_large_image. Favicon sizes vary but are typically square (1:1). Understanding these requirements helps developers create assets that display correctly across all platforms.

Given an aspect ratio and one dimension, you can calculate the missing dimension. If you know the width and target ratio W:H, the height equals width × (H/W). If you know the height, the width equals height × (W/H). This is essential when resizing images, setting up video exports, or creating responsive containers.

For example, to find the height for a 1440px-wide image at 16:9: height = 1440 × (9/16) = 810px. To find the width for a 600px-tall banner at 21:9: width = 600 × (21/9) = 1400px. This calculator performs these conversions automatically, including for custom ratios.