The paste.twilio.design website will be retired on July 31, 2026.
After this date, you can continue to use Paste. Our documentation will remain available in the GitHub project.
After this date, you can continue to use Paste. Our documentation will remain available in the GitHub project.
yarn add @twilio-paste/aspect-ratio - or - yarn add @twilio-paste/core
import {AspectRatio} from '@twilio-paste/core/aspect-ratio';
import {Box} from '@twilio-paste/core/box';
const Component = () => (
<AspectRatio ratio="4:3">
<Box position="absolute" top={0} right={0} bottom={0} right={0}>
Test
</Box>
</AspectRatio>
);
ratio RequiredRequired
Determines the aspect ratio of the element. Use a colon-separated number pattern (width:height).
- Type
string
Inherited props
Paste components will often extend native HTML elements and as a result will inherit or extend their available properties. Below is a list of the props this component has inherited and are also available to use.