Preferences

Letter 3D Swap

33DD SSWWAAPP HHOOVVEERR

Text

Flip Duration (s)0.45

Stagger Duration (ms)50

Property	Type	Default	Description
`text`	string	`"DEPARTURES"`	Display text to split into characters and flip. Re-splits into a fresh set of characters whenever it changes.
`direction`	"top" \| "right" \| "bottom" \| "left"	`"right"`	Flip axis — which edge each character rotates around.
`staggerFrom`	string \| number	`"first"`	Stagger origin: "first", "last", "center", "random", or an index.
`staggerDuration`	number	`50`	Delay (ms) between each character’s flip start.
`flipDuration`	number	`0.45`	Duration (s) of each character’s flip tween. Ease is fixed to "back.out(1.6)".
`trigger`	"hover" \| "mount" \| "manual"	`"hover"`	What starts the flip: hovering the board, once on mount, or an imperative call via ref.flip().
`onFlipComplete`	() => void	`undefined`	Called once the full staggered flip timeline finishes.
`charClassName`	string	`""`	Extra classes applied to each character’s flip container.
`className`	string	`""`	Extra classes applied to the root wrapper element.

textstring

Display text to split into characters and flip. Re-splits into a fresh set of characters whenever it changes.

Default"DEPARTURES"

direction"top" | "right" | "bottom" | "left"

Flip axis — which edge each character rotates around.

Default"right"

staggerFromstring | number

Stagger origin: "first", "last", "center", "random", or an index.

Default"first"

staggerDurationnumber

Delay (ms) between each character’s flip start.

Default50

flipDurationnumber

Duration (s) of each character’s flip tween. Ease is fixed to "back.out(1.6)".

Default0.45

trigger"hover" | "mount" | "manual"

What starts the flip: hovering the board, once on mount, or an imperative call via ref.flip().

Default"hover"

onFlipComplete() => void

Called once the full staggered flip timeline finishes.

Defaultundefined

charClassNamestring

Extra classes applied to each character’s flip container.

Default""

classNamestring

Extra classes applied to the root wrapper element.

Default""

gsap 3.15.0

Crafted withbyMohammad Tasin