What are the most common aspect ratios for web and video?

16:9 is the standard for HD video and widescreen monitors. 4:3 is older TV and camera format. 1:1 is square (Instagram posts). 9:16 is vertical video (TikTok, Stories). 3:2 is standard photography. 21:9 is ultrawide cinema.

How do I maintain aspect ratio in CSS?

Modern CSS: use aspect-ratio: 16/9; on the element. Legacy approach: use a container with padding-top: 56.25% (for 16:9) and position: relative, with the child absolutely positioned inside it.

Why do social media platforms crop images to specific ratios?

Platforms enforce aspect ratios to ensure consistent display in timelines and grids. Facebook feed images are cropped to 1.91:1. Instagram square posts are 1:1. Twitter/X cards are 2:1. Always design images to the platform's required ratio.

Home ToolsAspect Ratio Calculator

Aspect Ratio Calculator

Name: Aspect Ratio Calculator
Rating: 4.8 (120 reviews)
Author: DailyDevTools

Calculate aspect ratios and dimensions

Original Width

Original Height

New Width

New Height

Result Ratio

16:9

Use these tools directly in Chrome

Install the DailyDevTools extension — access all tools from your browser toolbar

Add to Chrome

What is Aspect Ratio Calculator?

Maintaining correct aspect ratios is critical for responsive design — a 16:9 video that appears distorted, or a product image that stretches on mobile, hurts user experience. DailyDevTools' Aspect Ratio Calculator finds the ratio for any two dimensions, calculates missing width or height for a given ratio, and covers common ratios for video (16:9, 4:3), photo (3:2), square (1:1), and social media formats.

How to use Aspect Ratio Calculator

1Enter width and height to calculate the simplified aspect ratio
2Or enter a ratio (e.g., 16:9) and one dimension to calculate the other
3Browse the quick-reference table of common aspect ratios with real-world examples
4Use the CSS padding-top hack calculator to create ratio-locked containers in CSS

Frequently asked questions

Comments

Explore other popular developer tools

CSS Minifier

Minify and optimize your CSS code

Color Converter

Convert Hex, RGB, HSL and CMYK

Gradient Generator

Create beautiful CSS gradients

Image Compressor

Compress images locally & privately

Aspect Ratio Calculator

What is Aspect Ratio Calculator?

How to use Aspect Ratio Calculator

Frequently asked questions

Comments

You might also like