---
title: Aspect Ratio
slug: aspect-ratio
section: components
description: .
---

# Aspect Ratio
<Description>Displays content within a desired ratio.</Description>

<ComponentPreview name="aspect-ratio" file="aspect-ratio-demo" />

<FeatureList items={['Accepts any custom ratio.']}/>

## Anatomy

```html
<div rdxAspectRatio>
    <img />
</div>
```

## API Reference

### Root
Contains the content you want to constrain to a given ratio.

`RdxAspectRatioDirective`
<PropsTable name="RdxAspectRatioDirective" />
