3D Displacement Text
WebGL text with fluid 3D displacement that follows your cursor. Built with Three.js shaders.
Default
Custom Color
Theme Aware
Automatically switches color between light and dark mode.
Props
| Prop | Type | Default | Description |
|---|---|---|---|
| text | string | "Hover Me" | Text to display |
| fontSize | number | 200 | Font size in pixels |
| font | string | "Inter, sans-serif" | Font family |
| color | string | undefined | Fixed color (overrides theme colors) |
| lightColor | string | "#000000" | Color in light mode |
| darkColor | string | "#ffffff" | Color in dark mode |
| class | string | undefined | Additional CSS classes |
Credits
- Inspired by VengenceUI