9:16 portrait aspect ratio
For AI Agents
Hand your agent this brief or the ReUI MCP, not a screenshot. Free to install.
Best for: A tall 9:16 box, the shape of stories and short full screen vertical video, at most 20rem wide
When to use
- Video, banner and screenshot slots in widescreen shapes such as 16:9, 21:9 and 16:10
- Photo and thumbnail slots in square, landscape or portrait shapes, cropped to fill the box
- Media boxes whose height follows their width, so the space is held before the image arrives
When not to use
- A portrait post that should take less height in a scrolling feed: use the Aspect Ratio Social Portrait example
- A sign in page split between the form and a full height image panel: use the Auth blocks
- Several images the user swipes or steps through one at a time: use the Carousel component
- A choice of exactly one option from a short visible list: use the Radio Group component
Agent notes
- Pass
ratioas width divided by height, as in 16 / 9; the base twin requires it and the radix twin falls back to 1 when it is missing - Every
imgis a random grayscalepicsum.photosplaceholder whosealtis only the ratio label; swapsrcand write a realalt - Set width on a parent, as the
max-w-mdormax-w-xswrapper does; radix putsclassNameon an absolute inner layer, where a width class breaks the ratio
https://reui.io/components/aspect-ratio/c-aspect-ratio-5.mdget_example("c-aspect-ratio-5")npx shadcn@latest add @reui/c-aspect-ratio-5Shadcn Components in Aspect Ratio Tall Portrait
About Shadcn Aspect Ratio Tall Portrait
9:16 portrait aspect ratio. Built with the Aspect Ratio component. A free, open source shadcn aspect ratio example you can install with npx shadcn@latest add @reui/c-aspect-ratio-5 and edit as your own code.
What You Can Build With Shadcn Aspect Ratio Tall Portrait
- Composes Aspect Ratio, so it drops into any project already using those components.
- Install it with the shadcn CLI: npx shadcn@latest add @reui/c-aspect-ratio-5
- Open source and free, with the full source on this page to copy or adapt.
More Shadcn Aspect Ratio Examples
- Widescreen 16:9 widescreen aspect ratio
- Standard 4:3 standard aspect ratio
- Square 1:1 square aspect ratio
- Ultrawide 21:9 ultrawide aspect ratio
- Classic Photo 3:2 classic photography aspect ratio
- Social Portrait 4:5 social media portrait aspect ratio
- Monitor 16:10 computer monitor aspect ratio
Related Shadcn Component Categories
Open-source shadcn attachment components for chat composers, upload states, and file previews.
Open-source shadcn autocomplete components for smart search, typeahead inputs, and suggestion lists.
Open-source shadcn avatar components for user profiles, team directories, and comment threads.
Open-source shadcn badge components for status labels, feature tags, and count indicators.
Open-source shadcn breadcrumb components for navigation trails, docs hierarchy, and app wayfinding.
Open-source shadcn bubble components for chat threads, assistant replies, and message reactions.
Frequently Asked Questions
When should I use Shadcn Aspect Ratio Tall Portrait?
Use it for a tall 9:16 box, the shape of stories and short full screen vertical video, at most 20rem wide.
Shadcn Aspect Ratio as a whole fits:
- Video, banner and screenshot slots in widescreen shapes such as 16:9, 21:9 and 16:10
- Photo and thumbnail slots in square, landscape or portrait shapes, cropped to fill the box
- Media boxes whose height follows their width, so the space is held before the image arrives
For a portrait post that should take less height in a scrolling feed, use the Aspect Ratio Social Portrait example. For a sign in page split between the form and a full height image panel, use the Auth blocks. For several images the user swipes or steps through one at a time, use the Carousel component. For a choice of exactly one option from a short visible list, use the Radio Group component.
How do I install Shadcn Aspect Ratio Tall Portrait?
Is Shadcn Aspect Ratio Tall Portrait free to use?
Which components does Shadcn Aspect Ratio Tall Portrait use?
Start building with ReUI Pro today.
Every Pro block, every style, and every future addition, with one license for unlimited projects.
From $249, once. Lifetime updates.