Particle Text
Interactive 3D particle text with WebGL
particle-text-tw
Customize
200
2
2
150
5
0.75
0.05
Props
| Name | Type | Default | Description |
|---|---|---|---|
| text | string | "brilliant." | The text content to render as particles. |
| colors | string[] | ["#40ffaa", "#40aaff", "#ff40aa", "#aa40ff"] | Array of colors to randomly assign to particles. |
| particleSize | number | 2 | Size of individual particles in pixels. |
| particleGap | number | 2 | Gap between particles. Higher values reduce density. |
| mouseControls | object | { enabled: true, radius: 150, strength: 5 } | Configuration for mouse interaction behavior. |
| fontSize | number | 200 | Font size of the text. When autoFit is enabled, this is the maximum font size. |
| autoFit | boolean | true | Automatically scale font size to fit container width. Uses fontSize as maximum. |
| backgroundColor | string | "transparent" | Background color of the canvas. |
| friction | number | 0.75 | Controls how quickly particles slow down (0-1). |
| ease | number | 0.05 | Controls how quickly particles return to origin (0-1). |