ShapeGrid
Rejilla animada de formas con estela al hover.
- Código: RODD·BG·048
- Familia: Fondos
- Origen: React Bits (David Haz) · Licencia MIT + Commons Clause
Cómo instalarlo
npx shadcn@latest add https://reactbits.dev/r/ShapeGrid-TS-TW
Cuándo usarlo
Detrás de un hero o una sección de impacto. Uno por página y con el texto siempre legible encima.
Props para personalizarlo
| Prop | Tipo | Por defecto |
|---|
| direction | string | 'right' |
| speed | number | 1 |
| borderColor | string | '#999' |
| squareSize | number | 40 |
| hoverFillColor | string | '#222' |
| shape | string | 'square' |
| hoverTrailAmount | number | 0 |
Otros efectos de fondos
- Topography — Mapa topográfico vivo con curvas de nivel.
- AnimatedGridPattern — Rejilla con celdas que se encienden al azar.
- CRTWarp — Plasma CRT con curvatura, scanlines y bloom.
- EvilEye — Ojo de fuego con iris animado que te sigue.
- FloatingLines — Líneas 3D flotantes que reaccionan al cursor.
- GradientWaves — Olas raymarched hacia un horizonte brumoso.