Preferences

Vortex

Customize

Speed0.8

Scale2.4

Noise Intensity1.5

Blend0.5

Opacity1

Property	Type	Default	Description
`speed`	number	`0.8`	Controls the animation speed of the vortex rotation.
`scale`	number	`2.0`	Zoom level of the vortex pattern. Higher values zoom out, showing more of the spiral.
`colorA`	string	`"#1B0F33"`	Inner or dark base color of the vortex (hex).
`colorB`	string	`"#FF5DA2"`	Outer accent and glow color of the vortex (hex).
`noiseIntensity`	number	`1.5`	Controls the intensity of the film-grain noise effect overlaid on the vortex.
`blend`	number	`0.5`	Controls the blending of the vortex effect with the background using Aurora-style smoothstep alpha.
`opacity`	number	`1.0`	Overall opacity of the canvas. Set below 1 to reveal content or background beneath.
`bgColor`	string	`"#000000"`	Background color visible through blend and opacity. Also sets the wrapper background.
`className`	string	`""`	Additional Tailwind CSS classes applied to the wrapper div.

speednumber

Controls the animation speed of the vortex rotation.

Default0.8

scalenumber

Zoom level of the vortex pattern. Higher values zoom out, showing more of the spiral.

Default2.0

colorAstring

Inner or dark base color of the vortex (hex).

Default"#1B0F33"

colorBstring

Outer accent and glow color of the vortex (hex).

Default"#FF5DA2"

noiseIntensitynumber

Controls the intensity of the film-grain noise effect overlaid on the vortex.

Default1.5

blendnumber

Controls the blending of the vortex effect with the background using Aurora-style smoothstep alpha.

Default0.5

opacitynumber

Overall opacity of the canvas. Set below 1 to reveal content or background beneath.

Default1.0

bgColorstring

Background color visible through blend and opacity. Also sets the wrapper background.

Default"#000000"

classNamestring

Additional Tailwind CSS classes applied to the wrapper div.

Default""

@react-three/fiber ^8.18.0three ^0.160.0

Crafted withbyMohammad Tasin