Aspect Ratio

Layout

Container that maintains a fixed width/height ratio for any child content.

🚧

Demo coming soon

Add a demo component to DEMOS in _showcase.tsx for layout/aspect-ratio

Instalação via CLI

$ npx kikitocn add aspect-ratio

Exemplo de uso

Aspect RatioExample.tsx

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

export function AspectRatioExample() {
  return (
    <AspectRatio />
  );
}

Props

Prop	Tipo	Padrão	Descrição
`children*`	`React.ReactNode`	—	Conteúdo a manter proporção
`ratio`	`number`	`16/9`	Razão largura/altura (ex: 16/9)
`className`	`string`	—	Classes CSS extras

Voltar para Layout

Carregando…