Mon–Fri: 10:00 – 18:00 
Request a call 
Aspect Ratio Calculator
Aspect-ratio math comes up constantly: resize a 1920x1080 image to fit a 600px-wide container, calculate the 56.25% padding-bottom trick, or pick a perfect crop for an Open Graph image. This calculator handles all three — enter one dimension or pick a preset, get the math.
Whenever you have a responsive container that should keep a fixed ratio — embedded videos, image placeholders, Open Graph image previews, hero banners. The modern aspect-ratio property is supported in all current browsers since 2021; the padding-bottom percentage trick still works as fallback.
aspect-ratio sets the container's shape. object-fit (cover or contain) controls how content fits inside. Cover crops to fill the container; contain shrinks to fit with letterbox bars. For Open Graph images, use 1200x630 native dimensions and avoid relying on object-fit cropping.
Hero images: 1920x1080 (16:9) for desktop, 1080x1920 (9:16) for mobile portrait. Open Graph: 1200x630 (1.91:1, Facebook/LinkedIn standard). Twitter/X cards: 1200x675 (16:9) for summary_large_image. Instagram square: 1080x1080 (1:1). Always check your specific CMS/template documentation for what it actually serves.
Greatest common divisor (GCD) of width and height — divide both by their GCD. For 1920×1080: GCD = 120, so 1920/120 = 16 and 1080/120 = 9 → 16:9. For 800×600: GCD = 200, so 800/200 = 4 and 600/200 = 3 → 4:3. The tool runs GCD math in JavaScript.
Get a free UX review
Our senior designers review your site's UX, visual hierarchy, accessibility, and conversion flow — and send you a prioritised list of quick wins.