Introduction:
Create random, unique, and organic-looking blob shapes inside of Elementor. You can make the blobs in many styles using gradients, overlays and images.
Install Blob Shapes Widget for Elementor #
This widget requires Unlimited Elements free version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “Blob Shapes”
- Hover over the widget in the search results and click install
- Add your Blob Shape widget to any Elementor Page
General Settings #
Shape
Choose a shape for your blob from the list.
Height
Determine the height of your blob shape. (Responsive Setting)
Image
Space between items relative to each item's width. 0 for no spacing, negative values to overlap.
Animation Time
The speed of the animation for animated style blob.
Blob Link Settings #
Enable Link
Enable or disable the link on your blob shape.
Link
If link is enabled add a URL you want your blob to link to.
Blob Content Settings #
Show Title
Enable or disable the title of your blob shape.
Title
Add text for your blob title
Show Text
Enable or disable the text of your blob shape.
Text
Add text for your blob.
Blob Gradient Color #
Gradient Angle
The angle of the gradient.
Fade Offset
The fade offset of the gradient.
Background Color 1,2
The colors of the gradient. If you want a solid color choose both to be the same color.
Color 1,2 Offset
The positions of the colors for the gradient.
Blob Image Style Settings #
Image Opacity
The opacity of your image, behind the image there is a gradient color.
Image Blend Mode
The blend mode for your image. normal, multiply, screen, overlay, darken, lighten, color-dodge, color-burn, difference, exclusion, hue, saturation, color, luminosity
Image Position
Change the position of your blob image.
Live Blob Example #
For more examples visit the full blob shapes demo