This React Component generates a rain effect in an html canvas. Check out a demo of it here: demo
- Install from npm:
npm install rainmaker-react
- Import the React Component in your file
import { RainEffect } from "rainmaker-react";
- Use the default React Component for use your customize your own properties
import React from "react";
const App: React.FC = () => {
return (
<div>
{/* default */}
<RainEffect />
{/* custom */}
<RainEffect
className="rain-effect"
count={COUNT}
wind={WIND}
fps={FPS}
fallSpeed={FALLSPEED}
jitterX={JITTER}
dropletLength={LENGTH}
dropletWidth={WIDTH}
dropletStyle={STYLE}
bgStyle={BGSTYLE}
noBackground={NO_BACKGROUND}
/>
</div>
);
};