Carregando…Carregando…Carregando…Carregando…Dark card where hovering (or dragging) sweeps a ruler that reveals a second text beneath the first, over a twinkling star field — adapted from Aceternity UI.
$ npx kikitocn add text-reveal-card@/lib/utilsmotionimport { TextRevealCard } from "@/components/ui/cn/text-reveal-card/TextRevealCard";
export function TextRevealCardExample() {
return (
<TextRevealCard text="Exemplo" revealText="Exemplo">
Text Reveal Card
</TextRevealCard>
);
}| Prop | Tipo | Padrão | Descrição |
|---|---|---|---|
text* | string | — | Texto visível 'coberto' |
revealText* | string | — | Texto revelado sob o cursor |
children | ReactNode | — | Conteúdo acima da área de reveal (título/descrição) |
className | string | — | Classes CSS extras |
Text Reveal Card — passe o mouse pra varrer o texto escondido
O texto de baixo aparece conforme o cursor varre.
Agora você viu ✦
Você conhece o efeito