AspectRatio
Media boxes that keep their shape: video embeds, thumbnails, gallery tiles. The child fills the frame.
Examples
16 : 9
1 : 1
<AspectRatio ratio="16 / 9">
<img src="..." alt="..." />
</AspectRatio>Props
| Prop | Type | Default | Description |
|---|---|---|---|
ratio | string | 16 / 9 | Any CSS aspect-ratio value. |
Accessibility
- Layout only: alt text and captions live on the media inside.
- Demos use labeled color blocks, never fake imagery.