Backgrounds & Visuals
Digital Rain
Matrix-style digital rain effect with abstract gradient background.
gradientdigitalrainmatrixabstract
Props
Customize the component with these props
| Property | Type | Default | Description |
|---|---|---|---|
backgroundColor | string | #000000 | Background color |
rainCount | number | 40 | Number of rain columns |
rainColor | string | #4ade80 | Rain color |
rainWidth | string | 1px | Rain width |
rainMinHeight | number | 10 | Minimum rain height percentage |
rainMaxHeight | number | 40 | Maximum rain height percentage |
rainMinDuration | number | 1 | Minimum rain animation duration |
rainMaxDuration | number | 3 | Maximum rain animation duration |
rainMaxDelay | number | 2 | Maximum rain delay |
rainOpacity | number | 0.5 | Rain opacity |
gradientFrom | string | rgba(0, 0, 0, 0) | Gradient start color |
gradientVia | string | rgba(20, 83, 45, 0.1) | Gradient middle color |
gradientTo | string | rgba(0, 0, 0, 0.8) | Gradient end color |
glowColor | string | rgba(34, 197, 94, 0.05) | Glow color |
glowSize | string | 500px | Glow size |
glowBlur | string | 150px | Glow blur |
glowOpacity | number | 1 | Glow opacity |
grainOpacity | number | 0.3 | Grain overlay opacity |
grainBaseFrequency | string | 0.65 | Grain base frequency |
grainOctaves | number | 3 | Grain octaves |
title | string | System | Title text |
className | string | Additional CSS classes |