Preview live, install via shadcn or copy the source.
This will install the component and its dependencies automatically.
| Name | Type | Default | Required | Description |
|---|---|---|---|---|
| children | string | — | Yes | The target text to scramble toward. |
| duration | number | 0.8 | No | Total scramble duration in seconds. |
| speed | number | 0.04 | No | Interval step in seconds between scramble updates. |
| characterSet | string | ABCDEFGHIJKLMNOPQRSTUVWXYZabcdefghijklmnopqrstuvwxyz0123456789 | No | Characters used while scrambling. |
| as | React.ElementType | — | No | Element/component to render as (e.g., "p", "span"). |
| className | string | — | No | Optional class name passed to the rendered element. |
| trigger | boolean | true | No | When true, starts the scramble animate. |
| onScrambleComplete | () => void | — | No | Callback fired after the scramble completes. |
| ...MotionProps | MotionProps | — | No | All additional Framer Motion props are supported and forwarded to the Motion component. |