Aspect Ratio
Locks a container to a given width-to-height ratio. The child fills the box — use object-fit: cover on images for clean crops.
Common ratios
Pass any numeric ratio (width ÷ height). The container always fills its parent width and locks the height proportionally.
16 / 9
16 / 9
4 / 3
4 / 3
1 / 1
1 / 1
With image
Any child fills the locked container. Use object-fit: cover on images to crop cleanly without distortion.
Portrait
Ratios below 1 produce portrait (tall) containers.
3 / 4