Aspect Ratio Converter

An aspect ratio describes the proportional relationship between an image's width and its height. It is written as W:H (e.g. 16:9) or as a single decimal (e.g. 1.778), and it is the single most important constraint when scaling images, video, slides, or UI layouts without distortion. When you resize a 1920×1080 photograph to a thumbnail, the ratio of 1.778 must be preserved; otherwise the photo looks stretched horizontally, squashed vertically, or worse, the content gets cropped. The Aspect Ratio Converter carries out this exact scaling for you across three equivalent representations, supports the most common display, photo, and social-media ratios as presets, and includes a fit-in-frame helper that returns the scaled size and centre offset for positioning an image inside a parent container without distortion.

The converter is useful for video editors exporting to YouTube (16:9) or TikTok (9:16), photographers cropping to standard photo ratios (3:2 or 4:5), designers laying out slides that must fit a given frame, web developers laying out hero banners at fixed pixel widths, and anyone who needs to know the exact pixel dimensions of a target box without breaking the source ratio. Where the related Aspect Ratio Calculator focuses on lock-and-fit modes for two dimensions at a time, this converter adds the third representation (decimal ratio) explicitly and adds the fit-in-frame helper for image-and-parent positioning problems.

How to Use the Aspect Ratio Converter

1. Enter the original width and height of the source image, video, or frame in pixels (or any consistent unit) in the Pixel dimensions section.
2. Toggle the Lock aspect ratio checkbox if you want the partner dimension to be computed automatically from the target ratio. Leave it off if you want to free-type both dimensions and only see the implied ratio.
3. Pick a target ratio from the preset dropdown (16:9, 4:3, 21:9, 1:1, 9:16, 4:5, 3:2, 5:4, 16:10, 1.85:1, 2.39:1, 2.76:1) or enter a Custom W:H or decimal value. The result panel updates instantly.
4. Read the Output block: pixel dimensions (W × H), decimal ratio, and the GCD-reduced W:H notation (e.g. 16:9 when the inputs are 1920×1080).
5. For image-in-parent positioning, switch to the Fit image into a parent frame helper. Enter the intrinsic image width, the aspect ratio (or click a preset row to copy its decimal), the parent width, and (for box mode) the parent height. The helper returns the scaled dimensions and the centre offset.

The Formula

The core conversion is one equation in two orientations. The decimal ratio is simply the width divided by the height:

decimal = W / H

To compute the missing dimension while preserving the ratio, use one of:

newHeight = newWidth × (H / W)

newWidth = newHeight × (W / H)

The W:H notation is the GCD-reduced integer pair. The Euclidean greatest-common-divisor algorithm gives the smallest integers whose ratio matches the decimal:

g = GCD(round(W), round(H))

reducedW = round(W) / g

reducedH = round(H) / g

For the fit-in-frame helper, the algorithm picks the constraining axis. In fit-by-width mode the scaled width equals the parent width and the scaled height is derived from the aspect ratio:

scaledW = parentW

scaledH = parentW / aspectDecimal

In fit-in-box mode (both parent width and parent height supplied), the image ratio is compared to the parent ratio. If the image is wider than the box, width is the constraint; otherwise height is:

imageRatio = aspectDecimal = W / H

boxRatio = parentW / parentH

if imageRatio > boxRatio: scaledW = parentW; scaledH = parentW / imageRatio

else: scaledH = parentH; scaledW = parentH × imageRatio

The centre offset, used to absolutely position the result inside the parent, is half the unused space on each axis:

offsetX = (parentW − scaledW) / 2

offsetY = (parentH − scaledH) / 2

The scale factor is the ratio of scaled width to intrinsic width, useful for reporting the resize as a percentage:

scale = scaledW / intrinsicW

Worked Examples

The five worked examples below are the exact spot-checks the converter's verification panel walks through. Running them in any order produces the same numbers.

Example 1, 1920 × 1080 → 1.778 decimal → 2560 × 1440 (preserve ratio at W = 2560)

Original (W, H) = (1920, 1080). Lock ratio, set new W = 2560.

decimal = 1920 / 1080 = 1.7777…

ratio = H / W = 1080 / 1920 = 0.5625

newH = 2560 × 0.5625 = 1440.0 px

GCD(1920, 1080) = 120 → reduced W = 1920/120 = 16, reduced H = 1080/120 = 9 → 16:9 ✓

Decimal of result = 2560 / 1440 = 1.7777…, identical to the original within floating-point precision. This is the standard QHD resolution and the standard 16:9 HDTV export frame at the next step up from 1080p.

Example 2, 1080 × 1920 → 0.5625 decimal (9:16 vertical)

Original (W, H) = (1080, 1920). Reporting the decimal ratio as W/H.

decimal = 1080 / 1920 = 0.5625

GCD(1080, 1920) = 120 → reduced W = 1080/120 = 9, reduced H = 1920/120 = 16 → 9:16 ✓

Note that 0.5625 is the inverse of the 16:9 decimal (1.778). Because the W:H notation is width-first, 1080 wide × 1920 tall reads as 9 wide : 16 tall after reduction. This is the standard vertical full-screen ratio used by TikTok, Instagram Reels, YouTube Shorts, and Instagram Stories.

Example 3, Fit 1920 px image into 1280 px frame at 16:9 → 1280 × 720

intrinsicW = 1920, aspectDecimal = 1.7777…, parentW = 1280, mode = fit-by-width.

scaledW = parentW = 1280 px

scaledH = 1280 / 1.7777… = 1280 × (9/16) = 720.0 px

scale = 1280 / 1920 = 0.6667× (66.67 %)

If the parent height is also supplied (say 800 px), the centre offset is offsetX = (1280 − 1280) / 2 = 0 and offsetY = (800 − 720) / 2 = 40 px, the result sits 40 px from the top of the parent and is centred horizontally.

Example 4, Fit 1920 × 1080 into a 1280 × 800 box

intrinsicW = 1920, intrinsicH = 1080, parentW = 1280, parentH = 800, mode = fit-in-box.

imageRatio = 1920 / 1080 = 1.7777…

boxRatio = 1280 / 800 = 1.6

imageRatio > boxRatio → the image is wider than the box, so width is the constraint.

scaledW = 1280 px

scaledH = 1280 / 1.7777… = 720.0 px

offsetX = (1280 − 1280) / 2 = 0 px

offsetY = (800 − 720) / 2 = 40 px

The scaled image is 1280 × 720 inside an 1280 × 800 parent; the 80 px of unused vertical space splits into 40 px of letterbox above and 40 px below.

Example 5, Lock ratio starting from a target W = 1920 at ratio 4:3

preset 4:3 → targetDecimal = 4 / 3 = 1.3333…

newW = 1920 (user input)

newH = newW / targetDecimal = 1920 / 1.3333… = 1920 × (3 / 4) = 1440.0 px

GCD(1920, 1440) = 480 → reduced W = 1920/480 = 4, reduced H = 1440/480 = 3 → 4:3 ✓

This is the standard 1080-line 4:3 frame (sometimes called 1920 × 1440); a common intermediate render size for legacy NTSC masters.

Where It Shows Up

Photography and social media. Instagram's feed crops portrait images to 4:5, TikTok and YouTube Shorts use 9:16 for vertical full-screen, and the standard 35 mm photo frame is 3:2. When you export a photo for these platforms, set the target ratio to 4:5 or 9:16 and check the resulting pixel dimensions before upload. The preset table in the converter has a dedicated column listing common usage for each ratio.

HDTV and cinema. 16:9 is the HDTV standard (Rec. ITU-R BT.709, the parameter values for HDTV production and international programme exchange). 4:3 is the legacy SDTV standard (Rec. ITU-R BT.601, which also covers 16:9 wide-screen encoding). 21:9 is the ultra-wide cinema and ultrawide-monitor format (the anamorphic 2.33:1 cinema). 2.39:1 is the SMPTE anamorphic-scope cinema presentation, the modern cinema standard. 2.35:1 is the older CinemaScope standard. 2.76:1 is Ultra Panavision 70, used for a small number of prestige releases. Editors cutting a 1.85:1 or 2.39:1 master use the converter to plan the export frame size.

Web design and UI. Hero images and banner graphics are often sized to fixed pixel widths (1920, 1440, 1280) for retina and standard displays. The lock-ratio mode lets you compute the matching height instantly. The fit-in-frame helper is the right tool when the parent container has a fixed size in CSS pixels and you need to know the offset for absolute positioning.

Screen sizing. When you buy a 24-inch or 27-inch monitor, the diagonal is the advertised number. Knowing the monitor's aspect ratio lets you compute the actual width and height in centimetres, useful for verifying that a desk or wall mount will fit the screen's true dimensions. (This page covers the ratio math; for the diagonal-to-physical-size helper with full cm output, see the related Aspect Ratio Calculator page.)

Print and large-format graphics. Posters, banners, and pull-up displays are often sized in inches or centimetres with a target ratio. Fit-in-box mode lets you compute the largest frame that fits inside a printer's roll width or a wall's cut-out.

Common Mistakes to Avoid

Truncating the float. When the new height is 720.0 (for a 1920-wide lock at 16:9), the converter returns 720.0, not 720 (which would happen to be exact in this case but would not be exact for ratios like 21:9 where the float ends in a non-integer). Display rounded values for pixels, but keep the raw float for any further math; otherwise the ratio drifts over multiple operations.

Ignoring the GCD zero case. When both dimensions are zero, GCD returns 0 and the reduced ratio is undefined. The converter falls back to showing the raw decimal in that case rather than producing a "0:0" string. Always check the inputs if the reduced ratio looks wrong.

Mixing portrait and landscape conventions. The converter is W-first: 16:9 is wider than tall, 9:16 is taller than wide. If you enter 1080 × 1920 as (W, H) you are saying a 1080-wide frame with a 1920-tall image, a portrait frame. Swap them only if you intend to flip the orientation.

Forgetting to lock the ratio when resizing. Resizing 1920 × 1080 to exactly 1000 × 800 breaks the ratio (1000 / 800 = 1.25, not 1.778). The result is a distorted image. Always use the lock mode or the fit mode when the target dimensions don't match the source ratio.

Using the wrong preset for the platform. 9:16 for Instagram Stories is NOT the same as 4:5 for an Instagram feed post. Double-check the preset before export; Stories and Reels are taller than the feed image. The preset dropdown shows the common usage for each ratio so the right one is hard to miss.

Confusing "fit inside" with "fill the box". The converter's fit-in-frame helper scales so the result fits inside the parent without exceeding either axis. If a platform requires the image to fill the box (covering both axes, with cropping), you need a different operation, usually a centre-crop of the result image.

Treating 21:9 and 2.39:1 as interchangeable. 21:9 = 2.333…:1 (used by some ultrawide monitors and certain TV standards), 2.39:1 is the SMPTE anamorphic-scope cinema presentation. They differ by about 0.057 in the decimal ratio, which is noticeable on a 4K-projected image.

Frequently Asked Questions

What three representations does the converter keep in sync?

The converter keeps three mathematically equivalent representations in sync: W:H notation (the colon-separated integer pair, e.g. 16:9), the decimal ratio (width divided by height, e.g. 1.77777…), and pixel dimensions (e.g. 1920 × 1080). Enter any one of them and the others update immediately.

How does the lock-aspect-ratio checkbox behave?

With the lock on, the converter treats one dimension as authoritative and computes the partner from the chosen target ratio. Type a new width and the height is derived; type a new height and the width is derived; type both and the ratio is reported as a sanity check. With the lock off, the converter simply shows the ratio implied by whatever pixel values you entered, even if those values distort the image.

What does the fit-in-frame helper return?

The helper returns the scaled width and height needed to fit an image of intrinsic width W and aspect ratio R into a parent frame of width P (and height, if known), the scale factor as a fraction and a percentage, and the centre offset (offsetX, offsetY) used to centre the result inside the parent. In fit-by-width mode the parent height is optional; in fit-in-box mode both axes must be supplied and the algorithm picks the constraining axis automatically.

Which aspect ratios are in the preset list?

The preset list covers 16:9 (HDTV per ITU-R BT.709), 4:3 (SDTV per ITU-R BT.601), 3:2 (35 mm stills), 16:10 (older monitors), 21:9 (ultrawide and anamorphic 2.33:1), 1:1 (square), 9:16 (vertical full-screen for TikTok, Reels, Shorts and Stories), 4:5 (Instagram portrait feed), 5:4 (large-format stills), 1.85:1 (US theatrical widescreen), 2.39:1 (SMPTE anamorphic scope), and 2.76:1 (Ultra Panavision 70). A custom W:H or decimal entry covers anything outside the list.

Why does 16:9 sometimes show as 1.78 and sometimes as 1.778?

Both are approximations of the same underlying ratio. The exact decimal is 16 / 9 = 1.77777… repeating forever. Tools that round to two decimal places display 1.78; tools that round to three or six show 1.778 or 1.777778. The converter reports the first six decimal places by default, which is enough precision for any rendering pipeline and most measurement applications.

How do I compute the GCD-reduced ratio manually?

Divide both dimensions by their greatest common divisor (GCD). For 1920 × 1080, GCD is 120, so the reduced ratio is 1920 / 120 : 1080 / 120 = 16 : 9. The Euclidean GCD algorithm finishes in O(log min(W, H)) steps regardless of how large the inputs are, so it is fast even on multi-megapixel pixel dimensions.

Does the converter work offline?

Yes. All math runs locally in your browser; no server calls, no API requests, no external dependencies. The component is fully self-contained and can be cached for offline use once loaded.

Can the Aspect Ratio Converter be used for professional or commercial purposes?

Yes, the calculator provides mathematically correct results that are suitable for professional, commercial, and educational use. For the Aspect Ratio Converter, For the Aspect Ratio Converter, For high-stakes applications (medical, legal, financial), verify results with a domain expert. For the Aspect Ratio Converter, the Aspect Ratio Converter formulas used are well-established and validated against reference standards.

For the Aspect Ratio Converter, How often are the underlying formulas updated?

For the Aspect Ratio Converter, the Aspect Ratio Converter formulas are based on established scientific, mathematical, or industry-standard references and rarely require updates. When standards change (e.g., new physical constants, revised tax brackets, updated standards), the Aspect Ratio Converter is updated to reflect the current authoritative source. For the Aspect Ratio Converter, Each calculator's references section lists the specific sources used.

What is letterboxing and pillarboxing, and how does the converter prevent it?

Letterboxing is the black bars added to the top and bottom of a frame when the source aspect ratio is wider than the display (e.g. showing a 2.39:1 film on a 16:9 TV). Pillarboxing is the black bars added to the sides when the source is taller than the display (e.g. showing a 4:3 video on a 16:9 screen). The converter's fit-in-frame helper returns the centre offset, which you can use to position the result with letterbox or pillarbox on both sides rather than stretching.

References

• W3C. CSS Aspect Ratio Level 1 (W3C Working Draft). World Wide Web Consortium. The CSS specification that defines the aspect-ratio property and standardises browser behaviour for proportional boxes.
• Rec. ITU-R BT.709-6 (2015). Parameter values for the HDTV standards for production and international programme exchange. International Telecommunication Union, Geneva. Defines the 16:9 HDTV production standard and the 1920 × 1080 / 1280 × 720 frame families.
• Rec. ITU-R BT.601-7 (2011). Studio encoding parameters of digital television for standard 4:3 and wide-screen 16:9 aspect ratios. International Telecommunication Union, Geneva. Defines the legacy SDTV 4:3 standard and the wide-screen 16:9 studio encoding parameters.
• SMPTE ST 2014-1:2009. VC-1 Compressed Video Bitstream Format and Decoding Process. Society of Motion Picture and Television Engineers. Defines the 2.39:1 anamorphic-scope cinema presentation and related SMPTE cinema aspect-ratio standards (2.35:1 CinemaScope, 1.85:1 US widescreen).
• ISO 13407:2019 (and predecessor ISO 9241-300 series). Ergonomics of human-system interaction, guidance on display sizes, workstation ergonomics, and proportional layout. International Organisation for Standardisation, Geneva.