The Flipbox plugin includes 103 animation effects powered by CSS animations. This page is your complete reference — every available animation name, organized by category. Use these names when selecting animations in the Flipbox editor, or reference them if you’re working with custom CSS.
Attention Seekers
Eye-catching, looping-style animations that grab attention.
Animation Name
Description
bounce
Bounces up and down in place
flash
Rapid opacity flash
pulse
Gentle pulsing scale effect
rubberBand
Elastic stretch and snap
shake
Horizontal shake
headShake
Subtle “no” head shake
swing
Pendulum-style swing
tada
Scale bounce with rotation, celebratory
wobble
Sideways wobble
jello
Jellylike elastic wiggle
heartBeat
Double-pulse heartbeat effect
Bounce Entrances
Cards enter with a springy, elastic bounce.
Animation Name
Entry Direction
bounceIn
Scales in from center
bounceInDown
Enters from top
bounceInLeft
Enters from left
bounceInRight
Enters from right
bounceInUp
Enters from bottom
Bounce Exits
Animation Name
Exit Direction
bounceOut
Scales out to center
bounceOutDown
Exits downward
bounceOutLeft
Exits to the left
bounceOutRight
Exits to the right
bounceOutUp
Exits upward
Fade Entrances
Smooth, elegant fade-in animations.
Animation Name
Entry Direction
fadeIn
Fades in from current position
fadeInDown
Fades in from above
fadeInDownBig
Fades in from far above
fadeInLeft
Fades in from the left
fadeInLeftBig
Fades in from far left
fadeInRight
Fades in from the right
fadeInRightBig
Fades in from far right
fadeInUp
Fades in from below
fadeInUpBig
Fades in from far below
Fade Exits
Animation Name
Exit Direction
fadeOut
Fades out in place
fadeOutDown
Fades out downward
fadeOutDownBig
Fades out far downward
fadeOutLeft
Fades out to left
fadeOutLeftBig
Fades out far to left
fadeOutRight
Fades out to right
fadeOutRightBig
Fades out far to right
fadeOutUp
Fades out upward
fadeOutUpBig
Fades out far upward
Flip Animations
Animation Name
Description
flip
Full 3D flip in place
flipInX
Flips in along horizontal axis
flipInY
Flips in along vertical axis
flipOutX
Flips out along horizontal axis
flipOutY
Flips out along vertical axis
Light Speed
Animation Name
Description
lightSpeedIn
Rockets in from right with skew
lightSpeedOut
Rockets out to right with skew
Rotate Entrances
Animation Name
Description
rotateIn
Spins in from center
rotateInDownLeft
Rotates in from top-left corner
rotateInDownRight
Rotates in from top-right corner
rotateInUpLeft
Rotates in from bottom-left corner
rotateInUpRight
Rotates in from bottom-right corner
Rotate Exits
Animation Name
Description
rotateOut
Spins out from center
rotateOutDownLeft
Rotates out to bottom-left
rotateOutDownRight
Rotates out to bottom-right
rotateOutUpLeft
Rotates out to top-left
rotateOutUpRight
Rotates out to top-right
Special Effects
Animation Name
Description
hinge
Falls away from top-left corner like a door hinge
jackInTheBox
Pops up from below with rotation, fun and playful
rollIn
Rolls in from left with rotation
rollOut
Rolls out to right with rotation
Zoom Entrances
Animation Name
Description
zoomIn
Scales in from small to full size
zoomInDown
Zooms in from above
zoomInLeft
Zooms in from left
zoomInRight
Zooms in from right
zoomInUp
Zooms in from below
Zoom Exits
Animation Name
Description
zoomOut
Scales out to small
zoomOutDown
Zooms out downward
zoomOutLeft
Zooms out to left
zoomOutRight
Zooms out to right
zoomOutUp
Zooms out upward
Slide Entrances
Animation Name
Description
slideInDown
Slides in from top
slideInLeft
Slides in from left
slideInRight
Slides in from right
slideInUp
Slides in from bottom
Slide Exits
Animation Name
Description
slideOutDown
Slides out downward
slideOutLeft
Slides out to left
slideOutRight
Slides out to right
slideOutUp
Slides out upward
Tip: For entrance animations, always use the “In” or neutral variants (bounceIn, fadeIn, zoomIn, slideInUp, etc.). The “Out” variants are exit animations — using them as entrances will make your cards briefly visible then disappear.