AspectRatio
Maintains a consistent width-to-height ratio for content like images and videos.
16:9 Default
The default widescreen ratio, ideal for video embeds and hero images.
16:9 ratio
1:1 Square
Perfect square ratio for profile pictures and thumbnails.
1:1
4:3 Classic
Classic photo and display ratio common in photography.
4:3
21:9 Ultra-wide
Ultra-wide cinematic ratio for banners and panoramic images.
21:9
Video Embed
Wrap video or iframe content to maintain consistent dimensions.
Video player
Image Gallery
Consistent square thumbnails in a grid layout.
Usage
Props
| Prop | Type | Default | Description |
|---|---|---|---|
ratio | string | "16/9" | Aspect ratio (e.g., "1/1", "4/3", "16/9", "21/9") |
children | content | - | Content to display within the ratio container |