TextCursor
Un texto que sigue al cursor dejando una estela de copias.
- Código: RODD·TX·026
- Familia: Tipografía
- Origen: React Bits (David Haz) · Licencia MIT + Commons Clause
Cómo instalarlo
npx shadcn@latest add https://reactbits.dev/r/TextCursor-TS-TW
Cuándo usarlo
Úsalas en titulares y mensajes clave. Una por pantalla: si todo se mueve, nada destaca.
Props para personalizarlo
| Prop | Tipo | Por defecto |
|---|
| text | string | ⚛️ |
| spacing | number | 100 |
| followMouseDirection | boolean | true |
| randomFloat | boolean | true |
| exitDuration | number | 0.5 |
| removalInterval | number | 30 |
| maxPoints | number | 5 |
Otros efectos de tipografía
- UnderlineToBackground — Subrayado que se convierte en fondo al hover.
- WavyText — Texto que entra con una ola.
- CircularText — Texto en órbita circular que acelera o se detiene al pasar el ratón.
- DepthText — Tipografía extruida en capas con parallax 3D.
- FoldText — Las líneas se despliegan como papel doblado que se abre.
- Highlighter — Subrayado dibujado a mano sobre el texto.