Particle Animation

MAX

A flexible particle effect animation for your React components.

Demo

Cursor ModePass the cursor over the text

Exclusive Launch 50% offspots left: 0 / 50
3D Cube - happy face3D Cube - Happy Face
$39.99

$19.99

Payment once and get lifetime access
Access to all animations
All updates
All animations
No subscriptions

Properties

The ParticleAnimation component accepts the following props:

PropertyTypeDefaultDescription
childrenReactNode-The content to animate
activebooleantrueWhether the animation is active
classNamestring""Additional CSS classes
particleCountnumber20Number of particles emitted per click
particleColorsstring[]["#ffffff", ...]Array of colors for the particles
particleSize[number, number][1, 3]Min and max size of particles
particleSpeednumber1Speed of the particles
emitOnHoverbooleanfalseEmit particles on mouse hover
emitOnClickbooleantrueEmit particles on click
particleLifenumber1000Particle life in ms
particleOpacitynumber0.7Opacity of the particles
direction"outward" | "upward" | "downward" | "random""outward"Direction of the particles

Usage Examples

Cursor ModePass the cursor over the text

Confetti ModeClick where you want