The Particle Image widget allows users to add an interactive particles effect to any image or icon. You can customise particle size, particle gap, noise, and color to achieve amazing particle effects. You can also add an entrance animation to image particles. This widget comes with different styling options to customise the look of your website.
Let’s look at each of the options in the “Particle Image Widget” below.
Install Particle Image Widget for Elementor #
This widget requires Unlimited Elements PRO version installed and activated on your WordPress website.
- Go to Unlimited Elements Widget Library
- Search in the search bar for “Particle Image”
- Hover over the widget in the search results and click install
- Add your “Particle Image” widget to any Elementor Page
General Settings #
Image
Choose an image to display.
Renderer
Choose the renderer from the dropdown menu.
- WebGL
- Default
Particle Size
Set the particle size.
Particle Gap
Set the particle gap.
Gravity
Set the gravity that defines the force which makes the particle go back to its origin position.
Noise
You can control the noise. The higher the number, the faster the particles will move.
Layers
Set the number of layers.
Layer Distance
Set the layer distance.
Depth
Set the depth of the particles.
Life Cycle
Turn on/off the life cycle effect.
Grow Duration
Set the grow duration of the particles.
Wait Duration
Set the wait duration.
Shrink Duration
Set the shrink duration.
Shrink Distance
Set the shrink distance.
Interaction Settings #
Mouse Interaction
Turn on or off the mouse interaction feature.
Mouse Force
Set the mouse force.
Init & Fade Animation
Set the initial animation for the image particle.
Link Settings #
Enable Link
Enable the link option for image particles.
Link
Paste your URL to link to image particles.
Particle Image Widget Styling #
You can style the width, height, size, alignment, and color of image particles.
Usage Examples #
Here are some live use cases for the Particle Image Widget.
