Glitter Warp

Starfield warp tunnel with glittering particle effects

glitter-warp-tw

Customize

Auto Play

Speed

1.0x

Turbulence

0.0

Density

20.0

Star Size

0.10

Focal Depth

0.05

Star Color

Brightness

1.0x

Props

Name	Type	Default	Description
`width`	number \| string	`"100%"`	Width of the component in pixels or CSS value
`height`	number \| string	`"100%"`	Height of the component in pixels or CSS value
`speed`	number	`1.0`	Animation speed multiplier
`color`	string	`"#ffffff"`	Star color in hex format
`density`	number	`15.0`	Density of stars (higher = more spread out)
`brightness`	number	`1.0`	Star brightness multiplier
`starSize`	number	`0.1`	Star size (higher = larger stars)
`focalDepth`	number	`0.05`	Focal depth for perspective (lower = stronger 3D effect)
`turbulence`	number	`0.0`	Turbulence intensity for wavey distortion
`autoPlay`	boolean	`true`	Whether to automatically play the animation
`className`	string	`""`	Additional CSS classes
`children`	React.ReactNode	`undefined`	Content to render on top of the glitter effect

widthnumber | string

Width of the component in pixels or CSS value

Default"100%"

heightnumber | string

Height of the component in pixels or CSS value

Default"100%"

speednumber

Animation speed multiplier

Default1.0

colorstring

Star color in hex format

Default"#ffffff"

densitynumber

Density of stars (higher = more spread out)

Default15.0

brightnessnumber

Star brightness multiplier

Default1.0

starSizenumber

Star size (higher = larger stars)

Default0.1

focalDepthnumber

Focal depth for perspective (lower = stronger 3D effect)

Default0.05

turbulencenumber

Turbulence intensity for wavey distortion

Default0.0

autoPlayboolean

Whether to automatically play the animation

Defaulttrue

classNamestring

Additional CSS classes

Default""

childrenReact.ReactNode

Content to render on top of the glitter effect

Defaultundefined