Aspect Ratio Calculator
Free Aspect ratio tool for art & design fundamentals. Enter values to see solutions, formulas, and educational explanations.
Aspect Ratio Calculator
Calculator
Adjust values & calculateEnter your values below. Every result is computed in your browser โ no data is sent to any server.
Formula: Aspect Ratio = Width : Height (simplified by GCD)
Worked example โ Aspect Ratio: 16:9 (Widescreen) | Scaled: 1280x720 | 2.07 Megapixels
Formula
Aspect Ratio = Width : Height (simplified by GCD)
The aspect ratio is found by dividing both the width and height by their greatest common divisor (GCD). Scaling preserves the ratio: New Height = New Width / (Width / Height). The diagonal is calculated using the Pythagorean theorem.
Worked Examples
Example 1: HD Video Resolution Analysis
Problem:Determine the aspect ratio of a 1920x1080 Full HD display and find the equivalent resolution at 1280 pixels wide.
Solution:GCD of 1920 and 1080 = 120 Ratio = 1920/120 : 1080/120 = 16:9 Decimal ratio = 1920/1080 = 1.7778 For 1280px wide: Height = 1280 / 1.7778 = 720px Diagonal = sqrt(1920^2 + 1080^2) = 2202.9 pixels Total pixels = 1920 x 1080 = 2,073,600 (2.07 MP)
Result:Aspect Ratio: 16:9 (Widescreen) | Scaled: 1280x720 | 2.07 Megapixels
Example 2: Instagram Post Optimization
Problem:A photographer has a 6000x4000 image from a DSLR camera. What is its aspect ratio, and what dimensions should it be for an Instagram portrait post (4:5)?
Solution:Original: GCD of 6000 and 4000 = 2000 Ratio = 6000/2000 : 4000/2000 = 3:2 For Instagram 4:5 at 1080 wide: Height = 1080 x (5/4) = 1350px The 3:2 image must be cropped to fit 4:5 Crop calculation: Keep height 4000, new width = 4000 x (4/5) = 3200px Then resize from 3200x4000 to 1080x1350
Result:Original: 3:2 | Instagram target: 4:5 (1080x1350) | Crop 6000x4000 to 3200x4000, then resize
Frequently Asked Questions
What is aspect ratio and why is it important?
Aspect ratio is the proportional relationship between the width and height of an image, screen, or video. It is expressed as two numbers separated by a colon, such as 16:9 or 4:3. The aspect ratio determines the shape of the display area and affects how content is framed and perceived. Using the correct aspect ratio is critical in photography, videography, web design, and print media because mismatched ratios cause distortion, cropping, or black bars. For example, a 16:9 video displayed in a 4:3 frame will either be letterboxed (black bars top and bottom) or cropped (sides cut off). Understanding aspect ratios ensures your content displays correctly across different devices, platforms, and media formats.
What are the most common aspect ratios used today?
The most widely used aspect ratio is 16:9, which is the standard for HD, Full HD, and 4K televisions, monitors, YouTube, and most streaming services. The 4:3 ratio was the historical standard for older television and computer monitors and is still used in some professional contexts. The 3:2 ratio is common in photography, used by most DSLR cameras and the classic 35mm film format. The 1:1 square format is popular on Instagram and social media. The 9:16 vertical ratio dominates mobile video platforms like TikTok and Instagram Reels. Ultra-widescreen ratios like 21:9 are used in cinema and ultrawide monitors. Web designers frequently work with 4:5 for social media posts and 2:1 for website hero banners.
How do I calculate aspect ratio from pixel dimensions?
To calculate the aspect ratio from pixel dimensions, divide both the width and height by their greatest common divisor (GCD). For example, a 1920x1080 image: the GCD of 1920 and 1080 is 120, so 1920 divided by 120 equals 16 and 1080 divided by 120 equals 9, giving the ratio 16:9. For dimensions that do not simplify to common ratios, you can express the ratio as a decimal by dividing width by height. A 1920x1080 image gives 1920/1080 = 1.7778, which corresponds to 16:9. Some resolutions like 1366x768 simplify to unusual ratios like 683:384, but are close enough to 16:9 (decimal ratio 1.7786 vs 1.7778) to be considered effectively 16:9 for practical purposes.
How do I resize an image while maintaining its aspect ratio?
To resize while maintaining aspect ratio, you only need to specify one dimension (either width or height) and calculate the other. If you know the target width, divide it by the original aspect ratio decimal to get the new height: New Height = Target Width / (Original Width / Original Height). If you know the target height, multiply it by the ratio: New Width = Target Height x (Original Width / Original Height). For example, to resize a 1920x1080 image to 1280 pixels wide: 1280 / (1920/1080) = 1280 / 1.778 = 720 pixels tall, giving you 1280x720. Most image editing software does this automatically when you lock the aspect ratio constraint, but understanding the math helps when working with CSS, responsive design, or batch processing.
What aspect ratio should I use for social media content?
Each social media platform has preferred aspect ratios for optimal display. Instagram feed posts work best at 1:1 (square, 1080x1080) or 4:5 (portrait, 1080x1350). Instagram Stories and Reels use 9:16 (1080x1920). Facebook feed posts perform well at 1.91:1 (1200x628) for links or 1:1 for engagement. Twitter or X recommends 16:9 (1200x675) for in-stream images. YouTube standard video is 16:9 (1920x1080 or 3840x2160). YouTube Shorts use 9:16 (1080x1920). TikTok videos use 9:16 (1080x1920). LinkedIn posts work best at 1.91:1 (1200x627) or 1:1. Pinterest favors tall pins at 2:3 (1000x1500). Using the correct ratio for each platform prevents awkward cropping and ensures your content looks professional.
What is the difference between display aspect ratio and pixel aspect ratio?
Display aspect ratio is the shape of the finished picture; pixel aspect ratio describes the shape of each individual sample. Modern formats use square pixels, so dividing width by height in pixels gives the display ratio directly. Older standard-definition video did not: NTSC DV stored 720 by 480 samples, a storage ratio of 1.5, and presented them as either 4:3 or 16:9 using non-square pixels, squeezing them horizontally in the 4:3 case (pixel aspect ratio about 0.9) and stretching them in the 16:9 anamorphic case (about 1.2). If a legacy clip looks squashed or stretched, the pixel aspect ratio flag has been misread, and no amount of resizing will fix it correctly.
What is the difference between letterboxing and pillarboxing?
Both are ways of fitting content of one shape into a frame of another without distorting it. Letterboxing puts bars above and below, and happens when the source is wider than the frame, such as a 2.39:1 film shown on a 16:9 television. Pillarboxing puts bars at the sides, and happens when the source is narrower, such as 4:3 archive footage on a widescreen display. The alternative is cropping, which fills the frame but discards image area and can cut faces or captions out of shot.
How do I hold an aspect ratio in CSS so a box scales with its container?
The direct route is the aspect-ratio property: set aspect-ratio to 16 / 9 with a fluid width, and the height follows automatically. The older technique, still useful for very broad browser support, exploits the fact that a percentage padding is resolved against the element's width: a wrapper with padding-top set to height divided by width as a percentage, 56.25 percent for 16:9, reserves the right shape, and the content is absolutely positioned inside it. Both prevent layout shift while an image or iframe loads.
What does a 2.39:1 anamorphic image mean, and how is it captured?
It is the modern widescreen cinema ratio, sometimes written 2.40:1 or loosely called scope. Anamorphic capture uses a lens that optically squeezes a wide field of view horizontally, typically by a factor of two, onto a taller negative or sensor area, so the recorded frame looks compressed until a matching desqueeze is applied in projection or post. The payoff is that the full height of the recording area is used rather than cropped, and the oval iris shape produces the elongated bokeh and horizontal flares associated with the look.
Why does an ultrawide monitor of the same diagonal have less screen area than a 16:9 one?
Because diagonal length alone does not determine area; the shape does, and the more elongated the rectangle the less area a fixed diagonal encloses. For a given ratio, height equals the diagonal divided by the square root of one plus the ratio squared. A 27-inch 16:9 panel works out at roughly 23.5 by 13.2 inches, about 310 square inches, while a 27-inch 21:9 panel is roughly 24.8 by 10.6 inches, about 264 square inches. Compare panels by width and height, not by the advertised diagonal.
References
Background & Theory
History
Reviewed for accuracy by Daniel Agrici, Founder & Lead Developer ยท Editorial policy
Related Calculators
๐งฎPixel Aspect Ratio Tool
Calculate pixel aspect ratio tool with inputs, formulas, and instant results.
๐งฎAspect Ratio Crop Calculator
Calculate aspect ratio crop with inputs, formulas, and instant results.
๐งฎActive Learning Ratio Calculator
Calculate active learning ratio with inputs, formulas, and instant results.
๐งฎArt Composition Ratio Calculator
Calculate art composition ratio with inputs, formulas, and instant results.
๐งฎCeiling Height Ratio Optimizer
Calculate ceiling height ratio optimizer with inputs, formulas, and instant results.
๐งฎLighting Ratio Calculator
Calculate lighting ratio with inputs, formulas, and instant results.
๐งฎWall to Floor Ratio Calculator
Calculate wall to floor ratio with inputs, formulas, and instant results.
๐งฎColor Contrast Ratio Calculator
Calculate color contrast ratio with inputs, formulas, and instant results.