In the case that you wish to separate a background in elementor with a shape divider in order to transform your image either up or down with waves or other shapes and at the same time you want the back background image to appear (where it makes the cut that is), unfortunately you won’t be able to do it with Elementor’s classic shape splitter. This is because the shape separator in the partition can only display color (until 1/31/2022).

To achieve the result that follows in the image you will need to use the magic of css and more specifically the clip-path.

Clip-path instructions:

• You should first visit the clip-path waves generator: https://wave.novoselski.net
• Adjust the offset, amplitude and frequency according to your taste (offset essentially refers to the height of the image)
• The generator itself makes waves for the bottom part of an image.
• If you want the result to be inverted (ie the waves to be on top of the image), you will have to manually override the final result that the generator gives you as it does not have the ability to invert (see below).

Waves below the image:

.kymatapanw{
clip-path: polygon(100% 0%, 0% 0% , 0% 81.00%, 1% 81.00%, 2% 81.02%, 3% 81.04%, 4% 81.07%, 5% 81.11%, 6% 81.16%, 7% 81.22%, 8% 81.29%, 9% 81.36%, 10% 81.45%, 11% 81.54%, 12% 81.64%, 13% 81.74%, 14% 81.86%, 15% 81.98%, 16% 82.11%, 17% 82.24%, 18% 82.38%, 19% 82.53%, 20% 82.68%, 21% 82.84%, 22% 83.00%, 23% 83.17%, 24% 83.34%, 25% 83.52%, 26% 83.69%, 27% 83.88%, 28% 84.06%, 29% 84.25%, 30% 84.43%, 31% 84.62%, 32% 84.81%, 33% 85.00%, 34% 85.19%, 35% 85.38%, 36% 85.57%, 37% 85.76%, 38% 85.95%, 39% 86.13%, 40% 86.31%, 41% 86.49%, 42% 86.66%, 43% 86.84%, 44% 87.00%, 45% 87.17%, 46% 87.32%, 47% 87.48%, 48% 87.62%, 49% 87.76%, 50% 87.90%, 51% 88.03%, 52% 88.15%, 53% 88.26%, 54% 88.37%, 55% 88.47%, 56% 88.56%, 57% 88.64%, 58% 88.72%, 59% 88.78%, 60% 88.84%, 61% 88.89%, 62% 88.93%, 63% 88.96%, 64% 88.98%, 65% 89.00%, 66% 89.00%, 67% 89.00%, 68% 88.98%, 69% 88.96%, 70% 88.93%, 71% 88.89%, 72% 88.84%, 73% 88.78%, 74% 88.71%, 75% 88.64%, 76% 88.55%, 77% 88.46%, 78% 88.36%, 79% 88.25%, 80% 88.14%, 81% 88.02%, 82% 87.89%, 83% 87.76%, 84% 87.61%, 85% 87.47%, 86% 87.31%, 87% 87.16%, 88% 86.99%, 89% 86.83%, 90% 86.66%, 91% 86.48%, 92% 86.30%, 93% 86.12%, 94% 85.94%, 95% 85.75%, 96% 85.56%, 97% 85.37%, 98% 85.18%, 99% 84.99%, 100% 84.80%);
}

To reverse this change the class to something more recognizable, go back to the generator and lower the offset a lot, get the new result, delete those first “100% 0%, 0% 0% ,” above and add to the end of the polygon before “)” the following: ,100% 100%, 0% 100%

That is, the code will become like this:

.kymatakatw{
clip-path: polygon(0% 19.5%, 1% 19.49%, 2% 19.48%, 3% 19.45%, 4% 19.42%, 5% 19.37%, 6% 19.32%, 7% 19.25%, 8% 19.18%, 9% 19.09%, 10% 19%, 11% 18.9%, 12% 18.79%, 13% 18.66%, 14% 18.54%, 15% 18.4%, 16% 18.26%, 17% 18.1%, 18% 17.95%, 19% 17.78%, 20% 17.61%, 21% 17.43%, 22% 17.25%, 23% 17.06%, 24% 16.87%, 25% 16.67%, 26% 16.47%, 27% 16.27%, 28% 16.06%, 29% 15.85%, 30% 15.64%, 31% 15.43%, 32% 15.21%, 33% 15%, 34% 14.78%, 35% 14.57%, 36% 14.36%, 37% 14.15%, 38% 13.94%, 39% 13.73%, 40% 13.52%, 41% 13.32%, 42% 13.13%, 43% 12.93%, 44% 12.75%, 45% 12.56%, 46% 12.39%, 47% 12.22%, 48% 12.05%, 49% 11.89%, 50% 11.74%, 51% 11.6%, 52% 11.46%, 53% 11.33%, 54% 11.21%, 55% 11.1%, 56% 11%, 57% 10.9%, 58% 10.82%, 59% 10.75%, 60% 10.68%, 61% 10.63%, 62% 10.58%, 63% 10.55%, 64% 10.52%, 65% 10.5%, 66% 10.5%, 67% 10.51%, 68% 10.52%, 69% 10.55%, 70% 10.58%, 71% 10.63%, 72% 10.68%, 73% 10.75%, 74% 10.82%, 75% 10.91%, 76% 11%, 77% 11.11%, 78% 11.22%, 79% 11.34%, 80% 11.47%, 81% 11.6%, 82% 11.75%, 83% 11.9%, 84% 12.06%, 85% 12.22%, 86% 12.4%, 87% 12.57%, 88% 12.76%, 89% 12.94%, 90% 13.14%, 91% 13.33%, 92% 13.54%, 93% 13.74%, 94% 13.95%, 95% 14.16%, 96% 14.37%, 97% 14.58%, 98% 14.79%, 99% 15.01%, 100% 15.22%,100% 100%, 0% 100%);
}

Finally, if you want other shapes, you can see the following generator: https://bennettfeely.com/clippy/ and also the following article: https://www.sitepoint.com/introducing-css-clip-path-property/

Good luck.

Original Source: https://nicolaslagios.com/%ce%b4%ce%b9%ce%b1%cf%87%cf%89%cf%81%ce%b9%cf%83%cf%84%ce%ae%cf%82-%cf%83%cf%87%ce%ae%ce%bc%ce%b1%cf%84%ce%bf%cf%82-elementor-%ce%bc%ce%b5-%ce%b4%ce%b9%ce%ac%cf%86%ce%b1%ce%bd%ce%bf-background-%cf%87/