Custom animations with replay controls
This section smoothly fades in from below as you scroll.
Perfect for introducing content in a subtle, elegant way. The element starts invisible and slightly below its final position, then transitions smoothly into view.
Try it: Scroll past this section and back up to see it animate again (if "Play Once" is disabled).
This card slides in from the left side, creating a dynamic entrance effect.
RepeatableThis card slides in from the right side, balancing the visual flow.
RepeatableThis section grows from a smaller size to full scale.
Creates a zoom-in effect that draws attention to the content. Great for highlighting important information or featured items.
Note: Enable "Reverse on Exit" to see the animation reverse when scrolling past.
This section rotates and scales into view.
Combines rotation with scaling for a playful, dynamic entrance. Adds personality to your page sections.
This section flips in like a card turning over.
Creates a 3D flip effect that's both eye-catching and modern. Perfect for revealing content in an unexpected way.
Each card appears with a slight delay, creating a cascading effect.
The staggered timing makes the animation feel more natural and polished.
Great for displaying multiple items like features or team members.
Creates visual rhythm and guides the user's eye through the content.
Choose between play-once or repeatable animations.
Play Once (default): Animations trigger only the first time elements enter viewport - perfect for production sites.
Repeatable: Animations replay every time you scroll to them - great for demos and showcases.
Reverse on Exit: Animations reverse when leaving viewport - creates a mirror effect.
Use the controls in the top-right corner to experiment with different behaviors!