Preferences

Rain Drop Text

RAIN DROP

Customize

Text

Stagger Delay (s)0.07

Duration (s)0.9

Drop Height (px)100

Repeat Delay (s)1.2

Property	Type	Default	Description
`text`	string	`"RAIN DROP"`	Display text to animate.
`delay`	number	`0.07`	Stagger delay (s) between each character starting its drop.
`duration`	number	`0.9`	Fall + settle duration (s) for each character.
`dropHeight`	number	`100`	Distance in pixels each character falls from before landing.
`ease`	string	`"bounce.out"`	GSAP ease string, e.g. "bounce.out", "elastic.out(1,0.5)", "back.out(1.7)".
`repeat`	boolean	`false`	Loop the drop animation indefinitely.
`repeatDelay`	number	`1.2`	Pause (s) between loops when `repeat` is true.
`color`	string	`"#111111"`	CSS color value for the text, e.g. "#378ADD" or "crimson".
`fontSize`	string	`"3.75rem"`	CSS font-size applied to each character.
`className`	string	`""`	Extra classes applied to the root wrapper div.

textstring

Display text to animate.

Default"RAIN DROP"

delaynumber

Stagger delay (s) between each character starting its drop.

Default0.07

durationnumber

Fall + settle duration (s) for each character.

Default0.9

dropHeightnumber

Distance in pixels each character falls from before landing.

Default100

easestring

GSAP ease string, e.g. "bounce.out", "elastic.out(1,0.5)", "back.out(1.7)".

Default"bounce.out"

repeatboolean

Loop the drop animation indefinitely.

Defaultfalse

repeatDelaynumber

Pause (s) between loops when `repeat` is true.

Default1.2

colorstring

CSS color value for the text, e.g. "#378ADD" or "crimson".

Default"#111111"

fontSizestring

CSS font-size applied to each character.

Default"3.75rem"

classNamestring

Extra classes applied to the root wrapper div.

Default""

gsap 3.15.0

Crafted withbyMohammad Tasin