ShinyText
Destello metálico que recorre el texto como un reflejo.
- Código: RODD·TX·021
- Familia: Tipografía
- Origen: React Bits (David Haz) · Licencia MIT + Commons Clause
Cómo instalarlo
npx shadcn@latest add https://reactbits.dev/r/ShinyText-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 | - |
| color | string | "#b5b5b5" |
| shineColor | string | "#ffffff" |
| speed | number | 2 |
| delay | number | 0 |
| spread | number | 120 |
| yoyo | boolean | false |
| pauseOnHover | boolean | false |
| direction | 'left' | 'right' | "left" |
| disabled | boolean | false |
| className | string | '' |
Otros efectos de tipografía
- TextAlongPath — Texto que sigue un trazado curvo.
- TextPressure — Tipografía variable que se ensancha y engorda según la cercanía del cursor.
- VariableProximity — El peso de cada letra cambia según la distancia al puntero.
- AuroraText — Texto relleno con una aurora de colores animada.
- CountUp — Contador animado con separadores y decimales, ideal para métricas.
- DockText — Letras con magnificación tipo dock.