Portal
Ciruular portal shader with customizable particle effects
portal-tw
Customize
0.25
1
10
1
0.75
0.5
0.75
1
1.5
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) |