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 the 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. Subscribe at Motion.
Basic Animation
Bouncing Easing
Color Interpolation
Exit Animation
Stagger
Advanced Dialogue
Animated Navbar
Copy Button
Css Spring
Drag
Feedback Popover
Flip
Flip Size
Gooey Button
Hover
Interactive Graph
Layout Id
Layout Id Cards
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
Scroll down to see the effect