Aspect Ratio Calculator
Compute simplified ratios and CSS aspect-ratio from width×height or presets. Paste resolution strings or lock a ratio while editing. Everything stays in your browser.
How to Use the Aspect Ratio Calculator
Enter width and height, pick an example chip, or paste a string like 1920×1080 into the resolution field. The calculator reduces the dimensions to the simplest ratio and gives you a copy-ready CSS aspect-ratio value.
Turn on ratio lock when you want to resize an image, video frame, thumbnail or layout box without stretching it. Change either width or height, and the matching dimension updates from the current ratio.
Examples
- 1920×1080 → 16:9 /
aspect-ratio: 16 / 9 - 1080×1080 → 1:1 /
aspect-ratio: 1 / 1 - 1024×768 → 4:3 /
aspect-ratio: 4 / 3 - 1080×1920 → 9:16 (vertical video / stories)
- Ratio lock ON, width set to 1280 → height 720 (16:9 preserved)
Common Use Cases
- Finding the ratio for video exports, YouTube thumbnails and social images.
- Writing modern CSS with
aspect-ratio: 16 / 9instead of padding hacks. - Resizing screenshots and product images while preserving their proportions.
Ratio Is Not Resolution
An aspect ratio describes shape, not pixel count or image quality. Both 1920×1080 and 1280×720 are 16:9, but they contain different numbers of pixels. Placing an image into a frame with another ratio also requires either empty space or cropping.
Check the destination's recommended resolution first, then use ratio lock to obtain integer dimensions. Use Image Crop to change the actual framing and the DPI & Print Size Calculator for physical output size.