Filaments

WebGL filaments: seven hairlines of light braided into a slowly undulating waveform, with pulses running along them and a pluck under the pointer.

Elyri

WebGL · Real-time

Components that come alive

A React library of living backgrounds, motion and text effects — built to make your interface feel alive.

Text

Thread color

#5b8cff

Gradient

#d46bff

Amplitude1Speed1Follow pointer

Prop	Type	Default	Description
`children`	`ReactNode`	—	Content layered above the background
`color`	`string`	`'#5b8cff'`	Main thread color (hex)
`highlightColor`	`string`	`'#d46bff'`	Second color the threads blend into (hex)
`amplitude`	`number`	`1`	Thread amplitude multiplier
`speed`	`number`	`1`	Animation speed multiplier
`interactive`	`boolean`	`true`	Whether threads near the pointer are plucked toward it
`className`	`string`	—	Extra class name

WebGL