Skip to main content

AspectRatio

Example

import { AspectRatio } from "@databricks/appkit-ui/react"

export default function AspectRatioExample() {
return (
<AspectRatio ratio={16 / 9} className="bg-muted">
<img
src="https://images.unsplash.com/photo-1588345921523-c2dcdb7f1dcd?w=800&dpr=2&q=80"
alt="Photo by Drew Beamer"
className="h-full w-full rounded-md object-cover"
/>
</AspectRatio>
)
}

AspectRatio

Source: packages/appkit-ui/src/react/ui/aspect-ratio.tsx

Props

PropTypeRequiredDefaultDescription
rationumber--
asChildboolean--

Usage

import { AspectRatio } from '@databricks/appkit-ui';

<AspectRatio /* props */ />