Aspect Ratio
Displays content within a desired ratio.
Installation
dotnet add package Lumeo
One-time app setup (AddLumeo(), CSS & JS) is covered in the
installation guide.
Usage
@using Lumeo <AspectRatio />
When to Use
- Maintaining consistent image or video aspect ratios across layouts
- Video embeds that need to preserve 16:9 or other standard ratios
- Responsive media cards where the thumbnail should not distort
- Grid layouts with uniformly sized media containers
16:9 Aspect Ratio
1:1 (Square)
1:1
4:3
4:3
21:9 (Ultra-wide)
21:9
Getting Started with Lumeo
Learn how to build beautiful UIs with Lumeo components.
Pick a ratio to see it applied live.
16:9