Aspect Ratio Calculator & Dimension Resizer (16:9, 9:16, 4:3, 1:1)
Free online Aspect Ratio Calculator and proportional dimension scaler. Calculate missing image and video width or height while maintaining exact pixel proportions. Includes presets for 16:9 widescreen YouTube video (1920x1080), 9:16 TikTok, Reels & Shorts (1080x1920), 1:1 Instagram square (1080x1080), 4:5 Instagram portrait feed, 4:3 tablet displays, and 21:9 ultrawide monitors. Features an interactive live preview box, decimal ratio breakdown, and 1-click CSS aspect-ratio code snippet generator.
Calculate Image & Video Aspect Ratios
Upload an image or video to detect its exact aspect ratio instantly, or enter custom dimensions to resize proportions and generate CSS code.
Upload Image or Video to Auto-Detect Ratio
Supports JPG, PNG, WEBP, SVG, MP4, WEBM, MOV (100% processed locally in browser)
1. Original Dimensions (or Base Ratio)
2. New Scaled Dimensions (Proportional Resize)
aspect-ratio: 16 / 9; /* 1.778 */Step-by-Step Instructions
Input Known Dimensions or Ratio
Enter your original width and height in pixels (e.g. 1920 x 1080) or choose a common standard aspect ratio (16:9, 4:3, 1:1, 9:16, 21:9).
Enter Target Dimension to Scale
Input your desired new width or height to automatically calculate the corresponding proportional dimension.
Inspect Greatest Common Divisor (GCD)
Review the exact simplified aspect ratio fraction computed using the Euclidean Greatest Common Divisor algorithm.
Copy Dimensions or CSS Code
Copy the calculated pixel dimensions, CSS `aspect-ratio: 16 / 9;` rule, or padding-top percentage for responsive web layouts.
Key Features & Capabilities
- Euclidean GCD algorithm computing exact simplified integer aspect ratios from any arbitrary pixel dimensions
- Proportional dimension scaler: enter a new width or height to calculate the exact corresponding dimension without distortion
- Pre-configured industry presets: 16:9 (Widescreen HD/4K), 9:16 (TikTok/Reels/Shorts), 4:3 (Classic TV), 1:1 (Square), 21:9 (Ultrawide Cinematic), and 4:5 (Instagram Portrait)
- Developer CSS code generator outputting modern `aspect-ratio` rules and legacy `padding-top` percentage hacks
- Visual aspect ratio preview box dynamically resizing to demonstrate geometric proportions
- Real-time instant calculation with zero server roundtrips
Frequently Asked Questions
How is an aspect ratio calculated mathematically?
An aspect ratio is calculated by dividing the width and height by their Greatest Common Divisor (GCD) using the Euclidean algorithm. For example, for 1920x1080 pixels: GCD(1920, 1080) = 120. Dividing 1920/120 = 16 and 1080/120 = 9, yielding the simplified ratio 16:9.
What are the standard aspect ratios for social media video and images?
Key standards include: 16:9 (1920x1080) for YouTube videos and desktop displays; 9:16 (1080x1920) for TikTok, Instagram Reels, and YouTube Shorts; 1:1 (1080x1080) for square Instagram posts; and 4:5 (1080x1350) for vertical Instagram feed photos.
How do I use aspect-ratio in modern CSS for responsive web design?
Modern CSS provides the native `aspect-ratio` property (e.g., `aspect-ratio: 16 / 9;`). When applied to responsive container elements or images with `width: 100%; height: auto;`, the browser automatically reserves the correct vertical space to prevent layout shifts (CLS).
How do you calculate the old padding-top responsive video container hack?
In legacy CSS before `aspect-ratio` support, responsive containers used `padding-top: (Height / Width) * 100%`. For a 16:9 video, `(9 / 16) * 100% = 56.25%`, creating a responsive container that scales with viewport width.
Related Utilities
Discover complementary online tools in the same workflow.
PX to REM & EM Converter
Convert CSS pixels (px) to rem and em units based on customizable base font sizes.
Image Resizer & Crop
Resize images to custom pixel dimensions or percentages without losing aspect ratio.
Convert to JPG
Turn PNG, WEBP, GIF, SVG, and BMP images into high-quality JPG format with adjustable compression.
Watermark Image
Stamp custom copyright text or logo images onto your photos with customizable transparency and position.
Meme Generator
Create viral memes in seconds. Add top and bottom captions to popular templates or your own pictures.
Blur Face & Privacy Redaction
Easily blur out faces, license plates, house numbers, and sensitive text to protect private data.