Carregando…Carregando…Carregando…Carregando…Wraps text in a looping SVG feTurbulence + feDisplacementMap filter for a hand-drawn wobble — adapted from Aceternity UI.
$ npx kikitocn add squiggly-text@/lib/utilsmotionimport { SquigglyText } from "@/components/ui/cn/squiggly-text/SquigglyText";
export function SquigglyTextExample() {
return (
<SquigglyText as="span">
Squiggly Text
</SquigglyText>
);
}| Prop | Tipo | Padrão | Descrição |
|---|---|---|---|
children* | React.ReactNode | — | Texto/nó embrulhado |
steps | number | 5 | Quadros de deslocamento no ciclo |
stepDuration | number | 80 | ms entre trocas de filtro |
scale | number | [number, number] | [6, 8] | Deslocamento máximo em px |
baseFrequency | number | 0.02 | baseFrequency da turbulência |
numOctaves | number | 3 | Octaves da turbulência |
as | 'span' | 'div' | 'span' | Elemento do wrapper |
className | string | — | Classes CSS extras |
Squiggly Text — wobble por filtro SVG feTurbulence