Add accurate, performant rain effects to your website with this customizable component. Perfect for adding atmosphere and depth to your designs.
Control the number of raindrops, their speed, wind direction, and length to match your desired aesthetic.
Enable splashes for drops hitting the bottom of the container, with optional ripples for added realism.
Choose from multiple rain styles including Lines, Dots, Mixed, Heavy, and Realistic to fit any design language.
Use it as a subtle overlay on hero sections to create a mood.
Perfect for weather-related interfaces or data visualization.
Detailed control over the rain simulation.
- Count: Number of raindrops (20-500)
- Speed: Vertical falling speed
- Wind: Horizontal drift
- Length: Length of rain lines
- Style: Choose between Lines, Dots, Mixed, Heavy, or Realistic
- Color: Raindrop color
- Opacity: range of opacity for depth
Performance — Keep particle count under 200 for best performance on mobile devices.
Depth — Use a lower opacity range (0.3 - 0.6) for a more subtle, integrated look.
Single Use License — Use in one client project with full commercial rights. No redistribution. 1 license = 1 client.
Due to the nature of our digital products, we are unable to offer refunds, but we're here to assist you with any questions or concerns!
FramerHub.io 
