Portal

Circular portal shader with customizable particle effects

portal-tw

Customize

Primary Color

Secondary Color

Center Color

Background

Speed

0.3

Density

1.0

Layer Count

Scale

1.5

Brightness

1.0

Wave Amplitude

1.0

Wave Frequency

0.75

Vertical Distortion

0.50

Depth Intensity

0.75

Props

Name	Type	Default	Description
`className`	string	`""`	Additional CSS classes for styling
`primaryColor`	string	`"#C084FC"`	Primary portal glow color (hex format)
`secondaryColor`	string	`"#E879F9"`	Secondary portal glow color (hex format)
`centerColor`	string	`"#F0ABFC"`	Center highlight color (hex format)
`ballBgColor`	string	`"transparent"`	Background color for the ball (hex, rgb, rgba, or transparent)
`speed`	number	`1.0`	Animation speed multiplier (0.1-3.0)
`density`	number	`1.0`	Particle density scale factor (0.5-2.0)
`layerCount`	number	`7`	Number of particle layers to render (1-7)
`waveAmplitude`	number	`1.0`	Horizontal wave distortion amplitude (0-2.0)
`waveFrequency`	number	`0.08`	Horizontal wave frequency (0.01-0.2)
`verticalDistortion`	number	`0.2`	Vertical wave distortion amount (0-1.0)
`depthIntensity`	number	`0.2`	Tunnel depth effect intensity (0.1-0.5)
`brightness`	number	`1.0`	Overall brightness multiplier (0.5-2.0)
`scale`	number	`1.0`	Scale/zoom of the portal effect (0.5-3.0)

classNamestring

Additional CSS classes for styling

Default""

primaryColorstring

Primary portal glow color (hex format)

Default"#C084FC"

secondaryColorstring

Secondary portal glow color (hex format)

Default"#E879F9"

centerColorstring

Center highlight color (hex format)

Default"#F0ABFC"

ballBgColorstring

Background color for the ball (hex, rgb, rgba, or transparent)

Default"transparent"

speednumber

Animation speed multiplier (0.1-3.0)

Default1.0

densitynumber

Particle density scale factor (0.5-2.0)

Default1.0

layerCountnumber

Number of particle layers to render (1-7)

Default7

waveAmplitudenumber

Horizontal wave distortion amplitude (0-2.0)

Default1.0

waveFrequencynumber

Horizontal wave frequency (0.01-0.2)

Default0.08

verticalDistortionnumber

Vertical wave distortion amount (0-1.0)

Default0.2

depthIntensitynumber

Tunnel depth effect intensity (0.1-0.5)

Default0.2

brightnessnumber

Overall brightness multiplier (0.5-2.0)

Default1.0

scalenumber

Scale/zoom of the portal effect (0.5-3.0)

Default1.0