Aspect Ratio Calculator

An aspect ratio describes the proportional relationship between a rectangle's width and its height, expressed as two numbers separated by a colon — for example, 16:9 or 4:3. It tells you how wide something is relative to how tall it is, without specifying exact pixel counts. A 1920×1080 frame and a 1280×720 frame share the same 16:9 aspect ratio because both reduce to the same simplified fraction.

Aspect ratios appear everywhere in digital media. Monitors, smartphones, TVs, digital cameras, social-media platforms, and video-conferencing software all operate within fixed ratio constraints. Choosing or respecting the correct ratio prevents letterboxing (black bars on the sides), pillarboxing (black bars on the top and bottom), and distorted stretching that makes images look squashed or stretched.

This free online aspect ratio calculator lets you enter any width and height in pixels, instantly see the simplified ratio and its common name, and then scale those dimensions to any target size while keeping proportions locked. You also get the decimal ratio, total pixel count, megapixel count, and the diagonal pixel length — all the numbers you need when prepping assets for web, print, or video production.

The calculator uses the Euclidean algorithm to find the Greatest Common Divisor (GCD) of the width and height you supply. Dividing both dimensions by their GCD produces the smallest whole-number ratio — what you see displayed as W:H. The decimal ratio is simply width divided by height and is used internally whenever you invoke the resize feature.

When you enter a target width (and have "Lock aspect ratio" checked), the calculator computes the matching height by dividing your target width by the decimal ratio and rounding to the nearest whole pixel. When you enter a target height instead, it multiplies that height by the decimal ratio and rounds. This guarantees the output dimensions are integer pixels that preserve your original proportions as closely as possible.

Additional statistics — total pixels (area), megapixels, and diagonal — give you a quick sense of file size and display scale. The diagonal is the Pythagorean distance across the rectangle: the square root of (width² + height²), expressed in the same pixel unit as the inputs.

Understanding which ratio fits your use case saves rework. Here is a reference table of the most widely encountered aspect ratios, their standard pixel sizes, and where you typically see them:

Clicking any preset in the calculator's Common Sizes panel loads those exact pixel dimensions instantly, so you can explore all ratios without typing anything manually.

One of the most practical features of this aspect ratio resize calculator is its ability to compute the missing dimension whenever you know only one side of the new size. This is critical when you have a source asset at one resolution — say a banner at 2400×600 — and a platform specifies only the maximum width of 1200 px. Instead of guessing, you enter 2400 and 600 as the source, type 1200 in the Target Width box, and the calculator immediately returns 300 as the proportional height. No algebra required.

The "Lock aspect ratio" checkbox controls whether the resize math runs at all. When it is checked (the default), entering either target dimension triggers the proportional calculation. When it is unchecked, no new dimensions are computed — useful if you just want the ratio stats without a resize preview.

Keep in mind that rounding to whole pixels can introduce a sub-pixel error of at most ±0.5 px. For most screen use cases this is imperceptible, but if you need pixel-perfect precision for print at high DPI you should verify the output with a dedicated image editor that supports fractional scaling.

Proportional resizing preserves the pixel density impression of the image. If you crop instead of scaling, the ratio changes; if you stretch non-proportionally, faces, circles, and text all appear distorted. Using this calculator before you export keeps everything looking exactly as intended.

Modern CSS has a native aspect-ratio property that accepts the same W / H notation you see in this calculator's output panel. For example, a container that should always be 16:9 regardless of viewport width is declared with aspect-ratio: 16 / 9;. This replaces older padding-top hack techniques (setting padding-top: 56.25% to fake a 16:9 box) and is now supported in all major browsers.

The calculator displays a ready-to-copy CSS snippet at the bottom of the results panel. You can paste it directly into a stylesheet. Combined with width: 100% and object-fit: cover on a child image or video element, this creates fully responsive media containers that never distort regardless of screen size.

When designing breakpoint layouts with a CSS grid generator or a breakpoint calculator, knowing the exact aspect ratio of your media blocks prevents content reflow surprises. Specify the ratio on the container element and let the browser do the arithmetic at each viewport width — far more reliable than hard-coding both dimensions at every breakpoint.

For <img> and <video> elements, including width and height HTML attributes (even when they are overridden by CSS) lets the browser reserve the correct space before the media loads, eliminating Cumulative Layout Shift (CLS) — a Core Web Vitals metric that affects SEO rankings.

Beyond the simplified ratio, this calculator surfaces three supplementary statistics that are useful in different professional contexts.

Total pixels (area) is simply width × height. A 1920×1080 frame contains 2,073,600 pixels. This number matters when estimating memory usage, GPU buffer requirements, or texture atlas budgets in game development.

Megapixels divides the total pixel count by 1,000,000. The same 1920×1080 frame is therefore 2.07 MP. Camera manufacturers advertise sensor resolution in megapixels because it gives a quick sense of detail and maximum print size. A 12 MP camera can produce a sharp 16×20 inch print at 300 DPI; knowing the MP of an image you are working with helps you decide whether to upscale or crop.

Diagonal is the Pythagorean distance in pixels across the frame — the square root of (width² + height²). At 1920×1080 this equals approximately 2202.91 px. For physical screen sizing, manufacturers state the diagonal in inches; this calculator outputs in the same pixel unit you entered, which is most useful when you need to compare relative diagonal sizes of two different resolutions sharing the same ratio, or when setting SVG viewBox boundaries that must accommodate a diagonal stroke.