Aspect ratio
Lock media to an inline-to-block ratio.
AspectRatio locks a frame to an inline-to-block ratio and sizes its direct child to fill the
frame. Use it for media such as an iframe, img, or video. Images and videos use
objectFit="cover" by default. Pass another objectFit value to change how they fit the frame.
Read Layout to choose a layout component.
Aspect ratio: Basic
Choose the rendered element
AspectRatio uses
Box's elementType and render contract.
Aspect ratio: Figure
API
AspectRatioProps also accepts compatible DOM and ARIA attributes and event handlers for its rendered element.
Prop
Type