Aspect Ratio Calculator

Calculate dimensions and ratios for responsive media.

Presets

Ratio Width

Ratio Height

Width (px)

Height (px)

Code

CSS

.container {
  aspect-ratio: 16 / 9;
  width: 100%;
  /* Or fixed dimensions */
  /* width: 1920px; */
  /* height: 1080px; */
}

/* Fallback for older browsers */
.container-fallback {
  position: relative;
  width: 100%;
  padding-bottom: 56.25%;
}

.container-fallback > * {
  position: absolute;
  inset: 0;
}

1920 × 1080

16:9