Glass Card

Display

Frosted glass card with configurable backdrop blur, opacity and border.

Glass Card — frosted glass with backdrop blur

blur: 12px

opacity: 0.1

blur: 24px

opacity: 0.2

Instalação via CLI

$ npx kikitocn add glass-card

Exemplo de uso

Glass CardExample.tsx

import { GlassCard } from "@/components/ui/cn/glass-card/GlassCard";

export function GlassCardExample() {
  return (
    <GlassCard />
  );
}

Props

Prop	Tipo	Padrão	Descrição
`children`	`React.ReactNode`	—	Conteúdo do card
`blur`	`number`	`12`	Intensidade do blur (px)
`opacity`	`number`	`0.1`	Opacidade do fundo (0-1)
`border`	`boolean`	`true`	Exibir borda sutil
`className`	`string`	—	Classes CSS extras

Carregando…