How to animate anything in Elementor (Shape Divider)

Teile den Beitrag

Share on facebook
Share on linkedin
Share on twitter
Share on email

Animating anything in Elementor becomes super easy when using keyframes! I will show you how to add nice animation to all shape dividers with the help of keyframes.

Step1: Copy my code and paste it in the Custom CSS of your theme or inside Elementor

Keep in my mind that this code only applies to the bottom shape dividers. If you want to be more specific just manipulate this line of code:



body {
.elementor-shape-bottom {
bottom: -1px;
animation: wave 22s cubic-bezier( 0.36, 0.45, 0.63, 0.53) infinite;
width: 210%;
@keyframes wave {
0% {
margin-left: 0;
50% {
margin-left: -1600px;
100% {
margin-left: 0px;

Step 2: Have fun animating!

Can I Use css-animation? Data on support for the css-animation feature across the major browsers from

Subscribe To Our Newsletter

Get updates and learn from the best


Möchten Sie Ihr Unternehmen pushen?

Schreiben Sie uns und bleiben Sie in Kontakt