SlicedWaves

Barras luminosas que ondulan como un ecualizador.

Código: RODD·BG·052
Familia: Fondos
Origen: React Bits (David Haz) · Licencia MIT + Commons Clause

Cómo instalarlo

npx shadcn@latest add https://reactbits.dev/r/SlicedWaves-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
color1	string	'#FF9FFC'
color2	string	'#5227FF'
color3	string	'#B497CF'
columns	number	14
rows	number	8
barThickness	number	0.1
speed	number	0.35
travel	number	0.7
waveSpread	number	0.9
rowOffset	number	1.0
softness	number	0.05
glow	number	0
brightness	number	1.0
contrast	number	1.0
opacity	number	0.5
orientation	string	'horizontal'
alternate	boolean	false
mouseInteraction	boolean	true
mouseStrength	number	1
mouseRadius	number	0.3
grain	boolean	true
grainIntensity	number	0.05
className	string	''

Otros efectos de fondos

WebThreads — Hilos luminosos que convergen en un punto.
Beams — Haces de luz arquitectónicos cruzados.
DotField — Campo de puntos que se abomba con el cursor.
FlickeringGrid — Rejilla de puntos que parpadean como un panel de datos.
Globe — Globo terráqueo 3D interactivo que gira solo.
GridMotion — Rejilla de elementos en perspectiva que sigue al ratón.