Aspect Ratio

The Aspect Ratio component ensures that an image is displayed within a fixed width–height ratio, regardless of its original dimensions. This is especially useful for maintaining consistent visual layout across devices or when images are user-generated or subject to change.

Usage

1. Drag the Aspect Ratio component onto the canvas.
2. Swap the image using the Component Properties panel.
3. Use Variant Mode to switch between common aspect ratios (e.g. Horizontal, Widescreen etc.), depending on the use case.

This makes it easy to adapt a single component to different layout contexts — such as profile thumbnails, video previews, or gallery cards — while keeping design consistency.

‍