NewThe Supreme Bundle: every Divi Supreme plugin, 31% less than buying separately.See what’s inside →

Shapes module

Divi Shapes that decorate without images.

Twenty-eight crisp SVG shapes, from squares and stars to soft organic blobs. Fill them with a colour or gradient and add a border.

What is the Divi Shapes module?

Shapes is a Divi 5 module in Divi Supreme Pro that draws a vector shape. Use it for background decoration, icons, badges, section accents or layered compositions, without exporting images from a design tool.

Pick from 28 shapes: basic geometry, polygons, a star, heart, shield, squircle, plus, chevron and eight organic blobs. Fill with a solid colour or a Divi gradient, add a border with its own colour and width, and set the size from 0 to 800px.

shapes

organic blobs

max size

image files

Start from a Shapes recipe.

The recipes and the playground run on the front end. Use Preview, or open the page, to try them.

Try every Shapes setting.

The recipes and the playground run on the front end. Use Preview, or open the page, to try them.

Everything Shapes can do.

28 shapes

Square, circle, polygons, star, heart, shield, squircle, plus, chevron and more.

8 organic blobs

Soft, hand-drawn style blobs for modern section backgrounds.

Solid or gradient

Any colour, or a linear or radial Divi gradient fill.

Borders

An outline with its own colour and width, or a border-only shape.

Any size

From tiny accents to 800px backgrounds, sharp at every size.

Pure SVG

No image files to export, upload or compress.

Shapes documentation

Setup for Divi 5: shape type, size, fill or gradient, and border.

Questions about Shapes.

Which shapes are included?

Twenty-eight: square, circle, rectangle, triangle, oval, trapezoid, parallelogram, diamond, hexagon, pentagon, octagon, star, semi circle, pill, ring, heart, shield, squircle, plus, chevron and eight blobs.

Can I fill a shape with a gradient?

Yes. Turn on Use Gradient Fill and use Divi’s gradient controls. Linear and radial gradients are supported.

Can a shape have a border?

Yes. Turn on Use Border and set its colour and width. Most shapes support it.

Will shapes look sharp on retina screens?

Yes. They are vector SVGs, so they stay crisp at any size.

How do I use shapes as backgrounds?

Place the module in a column, give it absolute positioning in Divi’s Position settings, and lower its z-index so it sits behind your content.

Can shapes animate?

Use Divi’s Animation, Transform and Scroll Effects settings to rotate, float or fade them.

Does Shapes work with Divi 5?

Yes. It is a native Divi 5 module with responsive size settings.

Next module, A to Z

Shuffle Letters Module

Related modules

Blob Image Module

Images cropped into blob shapes.

SVG Animation Module

Draw SVG strokes on scroll.

Floating Multi Images Module

Layered floating images.

4.9 out of 5

Rated 4.9 by Divi designers on Trustpilot. Running on 350,000+ sites.

Add character with a single shape.

Shapes comes with 70+ Divi 5 modules and 16 extensions in Divi Supreme Pro.

Divi Supreme