Introduction:
The Particles Background widget for Elementor is a powerful and customizable background builder. You can easily create amazing particles backgrounds that suit your Elementor page the best.
This widget requires Unlimited Elements PRO version installed and activated on your WordPress website.
Install the Particles Background Widget #
Navigate to Unlimited Elements >> Background Widgets >> Particles Backgrounds
Hover over the widget and click install.
Add the Particles Background Widget to a Section #
Edit Section >> Styles >> Unlimited Background >> Particles Background
Particles Background Settings #
Particle Type
- Circle
- Star
- Polygon
- Image
Particle Size
Set the particle size in pixels.
Number of Particles
Set the amount of particles to show on the canvas.
Particle Move Direction
- None
- Top
- Top Right
- Right
- Bottom Right
- Bottom
- Bottom Left
- Left
- Top Left
Randomize Particle Size
Set different random sizes for the particles.
Particles Size Pulse
Add a subtle pulse effect to the particles.
Particle Speed
Set the speed the particles animate.
Multi Color
Set more than one color for the particles.
Particle Color
Set the color for the particles.
Particle Opacity
Set the opacity for the particles.
Randomize Opacity
Add a random opacity to each particle.
Animated Opacity
Animate the opacity of each particle.
Connected Lines
Connect the particles with lines.
Line Width
Set the line width in pixels.
Detect Mouse
- Canvas (Section)
- Window (View Port)
On Hover
Set hover effect:
- Grab
- Bubble
- Repulse
- Grab + Bubble
On Click
Set click effect:
- Push
- Remove
- Bubble
- Repulse
- Push + Repulse
Bubble Size
Set bubble size in pixels.
Use Particles JSON File #
In some cases, you may want to generate a custom JSON file for your particles effect. To create a custom JSON file with advanced features visit this link: Particles.js
Open downloaded particlesjs-config.json file with any text/code editor and copy the code.
Paste the copied code in Widget’s Particle JSON field. It updates the Particles background. Notice that with the custom Particles JSON attribute all previous styling attributes won’t work.
Background Location #
Set the background location
In Background
In the back (behind) of content.
In Foreground
In the front (above) of content.
Video Overview #
Usage Examples #
Circle Particles
Star Particles
Polygon Particles
Image Particles
Randomize Particle Size
Multi Color Particles
Connected Line Particles
For more usage examples visit our live demo.
