Shapes are one of the most important elements in Design. So we’ve created this module to make your life easier. Shapes module adds life and creativity to your website. Boost your Divi designs, without having to use image files or custom code.

Content Options

Shapes

Type

Here you can change the type of shape from 16 different Shapes. Here are the shapes that you can choose:

1. Square
2. Circle
3. Rectangle
4. Oval
5. Trapezoid
6. Parallelogram
7. Diamond Square
8. Hexagon
9. 8 types of Blob

Size

Adjust the Size of the Shape here.

Design Options

Shapes

Shape Color

Here you can define a custom color for your shape.

User Border

Enable this option if you want to add Border and Corner Radius to the shape.

Shapes Shadow

Here you can add a nice Drop Shadow to the shape.

Changing the Position of the Shape

Let’s See how we can change the position of the shape. We have three options:

Using Margins Margin adds extra space to the outside of the shape, increasing the distance between the shape and other items on the page.

Using Transform Translate Options Under Transform Option, you’ll find the Translate tab and using that you can easily move the Shape anywhere on the screen by moving the box you’ll see under the Translate tab.

Using Position Options Position Options were added under the Advanced Tab. You can change the position type to Relative or Absolute and shape can be easily moved anywhere on the screen by sliding the controllers or entering your own value.

Shape Module Advanced Options

Use the advanced options to give your Shape custom CSS ID’s and Classes. Add some custom CSS for advanced styling and designate the module’s visibility on certain devices.