Aspect Ratio

Keep media and surfaces at a consistent ratio.

Loading preview…

Try it with your mouse, touch, or keyboard.

Use in your project

Install the public @raymondtju/ui package, then import this component through its stable entry point.

import { AspectRatio } from "@raymondtju/ui/components/aspect-ratio";

Need to own the code instead? Configure the public registry once, then install:

pnpm dlx shadcn@latest add @recrav/aspect-ratio

Package, theme, and registry setup

One consistent foundation

This preview uses the same component source and theme exported by the package. Neutral surfaces, blue actions, keyboard access, and reduced-motion support carry across your products.

Components and registry source are available under the MIT license. Keep the copyright and license notices when copying or redistributing code.