Introducing Shape Divider
A very powerful feature added to the section offers a very beautiful way to create your pages with amazing layouts on the top of the section or at the bottom.
Shape Divider is a perfect example that allows you to create cool separator effects, that until now were simply not possible.
We are starting off with 18 shapes you can choose from. These are starter shapes, that can be customized to create an endless and versatile array of dividers.
Here they are:
How Shape Divider Works
The Shape Divider feature uses highly optimized SVG shapes, that are manipulated and customized on the frontend editor.
Besides making the shapes lightweight SVG files, the loading is asynchronous, meaning they only load when you need them to, and after the page has finished loading, so it doesn’t affect page speed.
Because the shapes are SVGs, this guarantees they are always seen as high resolution, including on retina screens.
Control Over Shapes
Flexibility is an important factor when creating shapes. In Elementor, you have control over the various settings that help customize each and every shape:
Background: You can separate any background with shapes, including color, image, video and gradient backgrounds
Controls: With the Shapes feature, you can control the size of the shapes, as well as invert them or flip them over
Top & Bottom Shapes: Set a different shape for the top and bottom part of the section, with a separate set of controls for each side
Mobile editing: You can quickly customize a different shape to fit desktop, tablet and mobile screens, using Elementor’s Mobile Editing feature.