Shadcn.io is not affiliated with official shadcn/ui
21:9 Aspect Ratio (Ultrawide)
A 21:9 ultrawide aspect ratio container for cinematic content, immersive experiences, and ultra-widescreen displays
Cinematic width demands attention. This React component wraps content in a 21:9 aspect ratio using shadcn/ui's AspectRatio built on Radix UI primitives. The ratio prop (21 / 9) maintains ultrawide proportions matching cinema screens and gaming monitors, preventing layout shift when media loads. Perfect for film trailers, panoramic imagery, immersive hero sections, or content targeting ultra-widescreen displays—keeps cinematic aspect locked while width flexes responsively to parent containers for dramatic visual impact.
21:9 Aspect Ratio (Ultrawide) preview
Installation
Related Components
16:9 Widescreen
Standard modern video ratio
2:1 Panoramic
Wide panoramic aspect ratio
3:2 Photography
DSLR camera aspect ratio
1:1 Square
Equal width and height ratio
4:3 Traditional
Classic television aspect ratio
9:16 Vertical
Mobile and story format ratio
FAQ
Was this page helpful?
Sign in to leave feedback.