Animated backgrounds
Soft motion behind your content. Each background loops without a visible jump, and the colours follow your brand, so it fits your site without fiddling.
11 animations
-
4 s, loops
-
8 s, loops
-
8 s, loops
-
4 s, loops
-
8 s, loops
-
8 s, loops
-
8 s, loops
-
6 s, loops
-
6 s, loops
-
6 s, loops
-
8 s, loops
Tips for backgrounds
Keep contrast low
Text has to stay readable on top. Use soft colours in the background and keep your strongest colour for the button.
Pause it off screen
Pause the animation when it scrolls out of view to save battery. Most Lottie players make this easy.
Fill the box
Set the player to cover its area, so no empty edges show on very wide or very narrow screens.
Make your own background
Every animation here was made in Mosso, and you can make your own the same way: shapes, text, keyframes, easing and one-click animations like pop, rise and bounce, all in your brand. Then export Lottie, GIF, MP4 or transparent video.
Questions
Will an animated background slow down my site?
A Lottie background is a small vector file, much lighter than a background video. Load it after the rest of your page and pause it when it is off screen.
Can I use it as a video background?
Yes. Export MP4 or WebM from Mosso for slides, video calls and video editors.
Are these free for commercial use?
Yes. Use them in your own projects and in client work, including commercial work, with no credit needed. You can't resell them or give them away as templates or stock files.