Aspect Ratio Standard 6 - 9:16 Aspect Ratio (Vertical/Mobile)

Basic

Aspect ratio container with 9:16 vertical mobile ratio.
Shadcn Aspect Ratio Standard 6 component

Component data

ID
aspect-ratio/aspect-ratio-standard-6
Access
basic
Created
Oct 5, 2025
Type
example
Libraries
Radix UI, Base UI, React Aria

Aspect Ratio Standard 6 component design & features

This example uses the shadcn AspectRatio component from Radix UI to constrain child content to a 9:16 width-to-height ratio. Media inside the container scales responsively while preserving the fixed proportion.

Vertical 9:16 ratios mirror mobile stories and short-form video in phone-first layouts.