Text Scatter
Interactive letter scatter effect
text-scatter-tw
Bounce Back.
Customize
Text
1
Scatter Effect
200
90°
Timing
1s
2s
Props
| Name | Type | Default | Description |
|---|---|---|---|
| text | string | required | The text content to render and animate |
| className | string | "" | Additional CSS classes for the container element |
| as | React.ElementType | "h1" | HTML element to render as the container |
| velocity | number | 200 | Initial velocity of the scattered letters |
| rotation | number | 90 | Max rotation in degrees when scattered |
| scale | number | 1 | Scale factor when scattered |
| returnAfter | number | 1 | Delay in seconds before returning to original position |
| duration | number | 2 | Duration of the scatter animation |