Examples
Explore practical examples demonstrating Mercury's capabilities.
These examples illustrate the versatile animations achievable with Mercury. Many are adapted from Matt Perry’s Motion library, showcasing Mercury’s compatibility with reliable, battle-tested animations.
Important note
While the animations have been adapted to Svelte with Mercury, only examples from Motion’s free tier have their source code here, to respect their premium content. For access to exclusive animations and source code, consider subscribing to Motion+. You are encouraged to subscribe and replicate their advanced examples in Svelte using Mercury for practice.
Basic Animation Bouncing Easing Color Interpolation Exit Animation Stagger Advanced Dialogue Copy Button Css Spring Drag Feedback Popover Flip Flip Size Gooey Button Hover Interactive Graph Layout Id Cards Scroll Tap
Animated Navbar
Layout Id
The Oddysey
Explore unknown galaxies.
Angry Rabbits
They are coming for you.
Ghost town
Find the ghosts.
Pirates in the jungle
Find the treasure.
Lost in the mountains
Find your way home.
Scroll down to see the effect