A soft, blurred aurora glow
| 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.5 | Animation speed multiplier (0.1-5) |
layers | AuroraLayer[] | [...] | Aurora layers - array of { color: string, speed: number, intensity: number } |
noiseScale | number | 3.5 | Noise scale for aurora pattern (0.5-10) |
movementX | number | -2 | Horizontal movement speed (-5 to 5) |
movementY | number | -3 | Vertical movement speed (-5 to 5) |
verticalFade | number | 0.75 | Vertical fade intensity (0-2) |
bloomIntensity | number | 2 | Bloom/glow intensity (0.5-5) |
skyLayers | SkyLayer[] | [...] | Sky gradient layers - array of { color: string, blend: number } |
brightness | number | 0.8 | Overall brightness (0-2) |
saturation | number | 1 | Color saturation (0-2) |
opacity | number | 1 | Master opacity (0-1) |
className | string | "" | Additional CSS classes |
children | React.ReactNode | undefined | Content to render on top of the effect |
widthnumber | stringWidth of the component in pixels or CSS value
"100%"heightnumber | stringHeight of the component in pixels or CSS value
"100%"speednumberAnimation speed multiplier (0.1-5)
1.5layersAuroraLayer[]Aurora layers - array of { color: string, speed: number, intensity: number }
[...]noiseScalenumberNoise scale for aurora pattern (0.5-10)
3.5movementXnumberHorizontal movement speed (-5 to 5)
-2movementYnumberVertical movement speed (-5 to 5)
-3verticalFadenumberVertical fade intensity (0-2)
0.75bloomIntensitynumberBloom/glow intensity (0.5-5)
2skyLayersSkyLayer[]Sky gradient layers - array of { color: string, blend: number }
[...]brightnessnumberOverall brightness (0-2)
0.8saturationnumberColor saturation (0-2)
1opacitynumberMaster opacity (0-1)
1classNamestringAdditional CSS classes
""childrenReact.ReactNodeContent to render on top of the effect
undefined