Flicker
Flickering particle grid with customizable properties
flicker-tw
Customize
30
1.5
1
1
1
0.3
1.5
1
Props
| Name | Type | Default | Description |
|---|---|---|---|
| className | string | "" | Additional CSS classes for the wrapper element |
| spacing | number | 20 | Distance between particle centers in pixels |
| particleSize | number | 1.5 | Radius of each particle in pixels |
| color | string | "#5A4B81" | Base color for dim particles (hex or rgba) |
| glowColor | string | "#FF9FFC" | Glow color when particles brighten (hex or rgba) |
| alpha | number | 1 | Overall opacity of the entire effect (0-1) |
| overlay | number | 1 | Radial vignette darkness intensity (0-1) |
| overlayColor | string | "#0a0a0a" | Color of the overlay vignette (hex or rgb) |
| minFrequency | number | 0.3 | Minimum flicker frequency per particle |
| maxFrequency | number | 1.5 | Maximum flicker frequency per particle |
| rate | number | 1 | Global animation speed multiplier |
| shape | "circle" | "square" | "circle" | Shape of the particles |
| jitter | boolean | false | Whether to randomly offset particles from the grid |
| flickerChance | number | 1.0 | Probability that a particle will flicker (0-1) |
| mouseEffect | boolean | false | Whether mouse proximity affects particles |
| colorPalette | string[] | undefined | Array of colors to randomly assign to particles |