Raw shadcn — not wrapped in @oddapp/ui yet.

Import directly: @/components/ui/aspect-ratio. OddApp tokens are applied via globals.css @theme. All token rules still apply.

AspectRatio

Constrains child content to a specific aspect ratio.

Default

Import and render this component in your app using the snippet below.

import { AspectRatio } from '@/components/ui/aspect-ratio'

<AspectRatio ratio={16 / 9}>
  <img src="/preview.jpg" alt="Preview" className="object-cover w-full h-full rounded-md" />
</AspectRatio>