Add Particles background to Sections in Elementor Page Builder

With the recent release of Elementor Addon Elements (V 1.1), you can add animated particles background on sections.
There feature is utilizing the Particle js library developed by Vincent Garreau.

This feature is also inspired by another Elementor Addon – Granular Controls for Elementor by Zulfikar Nore (unfortunately not in active development at the moment).

Here are some simple steps to add Particles background to Elementor’s section.
(we are assuming that you have our plugin Elementor Addon Elements installed and active.)

• Edit section settings and go to the Styles tab. Set your desired background there. It can be any color, image, or gradient.
• Now go to the Particles section under the Styles tab.
  
• In the Particles section, Enable particles by settings the switcher to Yes.
• Now you will see default Particles moving in your section.

Creating your own particles background effect

• Default particles are available once you enable Particle Background in Section’s settings. You will notice some JSON code in the text area there. You can also generate your own style and use it here.
• For this, go to this URL https://vincentgarreau.com/particles.js/
• On the right top corner, you will notice a lot of configuration options. Just play with them and create your own style. You will see the live preview in the background.
• Once you have generated your desired style, click on the “Download Current Config” option and the end of that configuration section. This will download a JSON file.
  
• Open the JSON file and copy its content and paste it in the “Particle Json” section mentioned above.

Live Demo

Click Here to view the Particle Background Demo setup.