# 💥\[FREE Plugin\] Particles.js **URL:** \ **Category:** Showcase\ **Created:** [March 31, 2020, 7:51pm UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231 "2020-03-31T19:51:53Z")\ **Posts on this page:** 20\ **Page:** 1
**Author:** ![lstk.kb](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/lstk.kb/32/163042_2.png) [@lstk.kb](https://forum.bubble.io/u/lstk.kb)\ **Post date:** [March 31, 2020, 7:51pm UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/1 "2020-03-31T19:51:53Z")
Visual effect for your site. Визуальный эффект для вашего сайта. ![start](https://us1.discourse-cdn.com/bubble/original/3X/b/b/bbdbe3910803d5b12659b2e40e069202b470c1c0.jpeg) > **[Particles.js Plugin for Bubble, by Igor Baraban](https://bubble.io/plugin/particlesjs-1585514817429x400609961155231740)** > > Particles.js Plugin page on Bubble, by Igor Baraban. Add Particles.js in one click to your app. Bubble lets you build web apps without any code. **Как только пост получит 100 лайков , я добавлю параметры для настройки )))** **As soon as the post receives 100 likes, I will add parameters for customization)))** ---
**Author:** ![tom1](https://avatars.discourse-cdn.com/v4/letter/t/b487fb/32.png) [@tom1](https://forum.bubble.io/u/tom1)\ **Post date:** [March 31, 2020, 8:23pm UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/2 "2020-03-31T20:23:51Z")
Can you make a demo link? ---
**Author:** ![lstk.kb](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/lstk.kb/32/163042_2.png) [@lstk.kb](https://forum.bubble.io/u/lstk.kb)\ **Post date:** [March 31, 2020, 8:41pm UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/3 "2020-03-31T20:41:27Z")
> **[Bubble - Visual Programming](https://helper-2020.bubbleapps.io)** > > Build stuff without code and launch a startup without a tech-cofounder! Bubble is a visual programing language. Instead of typing code, use a visual editor to build applications. ---
**Author:** ![lstk.kb](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/lstk.kb/32/163042_2.png) [@lstk.kb](https://forum.bubble.io/u/lstk.kb)\ **Post date:** [April 1, 2020, 6:21pm UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/4 "2020-04-01T18:21:41Z")
I have added options. Now the particles can be customized. 1. Create Group and set ID Attribute particles-js 2. Create Particle and set Params ---
**Author:** ![josh10](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/josh10/32/82900_2.png) [@josh10](https://forum.bubble.io/u/josh10)\ **Post date:** [April 1, 2020, 7:53pm UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/5 "2020-04-01T19:53:02Z")
I am not sure yet where I might use this, but I want to recognize your work! It looks good and is done well! Would be neat if you created it as a loading element when something is loading, there would be an effect or color change option. ---
**Author:** ![lstk.kb](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/lstk.kb/32/163042_2.png) [@lstk.kb](https://forum.bubble.io/u/lstk.kb)\ **Post date:** [April 2, 2020, 6:46am UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/6 "2020-04-02T06:46:33Z")
Good! I will do a separate initialization action. 🙂 ---
**Author:** ![lstk.kb](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/lstk.kb/32/163042_2.png) [@lstk.kb](https://forum.bubble.io/u/lstk.kb)\ **Post date:** [April 3, 2020, 7:47am UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/7 "2020-04-03T07:47:01Z")
Hi! Done! ![03-04-2020 10-56-58](https://us1.discourse-cdn.com/bubble/original/3X/5/1/51a8a7050092871cccca7975686691b211d01bc9.jpeg) ![03-04-2020 10-57-58](https://us1.discourse-cdn.com/bubble/original/3X/3/4/34ae2cce87bdfc8a2b7b7c436782764b870311d3.jpeg) ![03-04-2020 10-58-28](https://us1.discourse-cdn.com/bubble/original/3X/2/4/24b3c9a7bf002c52b389dfe85792fc660cefe6a3.jpeg) ---
**Author:** ![josh10](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/josh10/32/82900_2.png) [@josh10](https://forum.bubble.io/u/josh10)\ **Post date:** [April 6, 2020, 5:06pm UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/8 "2020-04-06T17:06:31Z")
Awesome! I’ll try it out today. ---
**Author:** ![lstk.kb](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/lstk.kb/32/163042_2.png) [@lstk.kb](https://forum.bubble.io/u/lstk.kb)\ **Post date:** [April 8, 2020, 5:20am UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/9 "2020-04-08T05:20:15Z")
> [@josh10](#): > > Потрясающие! Я попробую сегодня. It turned out to run? Or do you need to do more detailed instructions? ---
**Author:** ![stepanhuge](https://avatars.discourse-cdn.com/v4/letter/s/ac8455/32.png) [@stepanhuge](https://forum.bubble.io/u/stepanhuge)\ **Post date:** [April 12, 2020, 10:56am UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/10 "2020-04-12T10:56:10Z")
Can particles be showed in the header? Cause I can get it works in a group in the page but not in the header. Thanks for your job the plugin is awesome ---
**Author:** ![lstk.kb](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/lstk.kb/32/163042_2.png) [@lstk.kb](https://forum.bubble.io/u/lstk.kb)\ **Post date:** [April 12, 2020, 2:04pm UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/11 "2020-04-12T14:04:18Z")
Which bubble element do you use as a “header”? ---
**Author:** ![stepanhuge](https://avatars.discourse-cdn.com/v4/letter/s/ac8455/32.png) [@stepanhuge](https://forum.bubble.io/u/stepanhuge)\ **Post date:** [April 13, 2020, 6:22am UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/12 "2020-04-13T06:22:26Z")
I am user header reusable component, then inside I create a group where I am trying to show the particles. ---
**Author:** ![richardaxeoz](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/richardaxeoz/32/56006_2.png) [@richardaxeoz](https://forum.bubble.io/u/richardaxeoz)\ **Post date:** [April 13, 2020, 6:35am UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/13 "2020-04-13T06:35:06Z")
Very nice @lstk.kb ---
**Author:** ![stepanhuge](https://avatars.discourse-cdn.com/v4/letter/s/ac8455/32.png) [@stepanhuge](https://forum.bubble.io/u/stepanhuge)\ **Post date:** [April 13, 2020, 7:25am UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/14 "2020-04-13T07:25:25Z")
I got it work, I forgot to change the default color. ---
**Author:** ![lstk.kb](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/lstk.kb/32/163042_2.png) [@lstk.kb](https://forum.bubble.io/u/lstk.kb)\ **Post date:** [April 13, 2020, 9:25am UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/15 "2020-04-13T09:25:57Z")
I am very glad that everything worked out for you. ---
**Author:** ![sat\_miha](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/sat_miha/32/58187_2.png) [@sat\_miha](https://forum.bubble.io/u/sat_miha)\ **Post date:** [April 13, 2020, 10:31am UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/16 "2020-04-13T10:31:51Z")
Nice) ---
**Author:** ![lstk.kb](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/lstk.kb/32/163042_2.png) [@lstk.kb](https://forum.bubble.io/u/lstk.kb)\ **Post date:** [May 18, 2020, 3:45pm UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/17 "2020-05-18T15:45:08Z")
Made a page for testing the plugin particle.js - [https://helper-2020.bubbleapps.io/particles](https://helper-2020.bubbleapps.io/particles) ![GIF 18.05.2020 18-06-52](https://us1.discourse-cdn.com/bubble/original/3X/b/3/b327a526701eb7d26b6fa7cea646aff9a61c4a3e.gif) ![GIF 18.05.2020 18-11-52](https://us1.discourse-cdn.com/bubble/original/3X/4/f/4f462fcec071a2898c97b0fc6bf6f2a59746beb5.gif) ![GIF 18.05.2020 18-19-40](https://us1.discourse-cdn.com/bubble/original/3X/0/9/0909d5f21a91fabf234c7ff8aa614e178afce172.gif) ---
**Author:** ![Future](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/future/32/126701_2.png) [@Future](https://forum.bubble.io/u/Future)\ **Post date:** [February 10, 2021, 2:22am UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/18 "2021-02-10T02:22:32Z")
Awesome plugin, thanks! One question, do you know if there’s any easy to stop interaction? (just having the particles but no hover interaction). Thanks again! ---
**Author:** ![alejandrowunderlich](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/alejandrowunderlich/32/97601_2.png) [@alejandrowunderlich](https://forum.bubble.io/u/alejandrowunderlich)\ **Post date:** [June 2, 2021, 6:29pm UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/19 "2021-06-02T18:29:21Z")
I have the same question @lstk.kb Can I turn off interaction? Or change the behaviour? Instead of having them “run away” from the mouse, perhaps have them be attracted to the mouse? I feel like the mouse interaction currently ruins the effect by compacting all the particles. EDIT There’s also another problem. If I add another group, like an image and a title, inside the particle-js group, the particles get pushed down. Any way to fix this? ---
**Author:** ![alejandrowunderlich](https://sea1.discourse-cdn.com/bubble/user_avatar/forum.bubble.io/alejandrowunderlich/32/97601_2.png) [@alejandrowunderlich](https://forum.bubble.io/u/alejandrowunderlich)\ **Post date:** [June 2, 2021, 10:24pm UTC](https://forum.bubble.io/t/free-plugin-particles-js/84231/20 "2021-06-02T22:24:24Z")
@lstk.kb Checking the github, I believe your current interaction on hover is set to `repulse`. We should be able to set it to `grab`. We should also be able to set it to true or false. Similar issue with the onclick setting. Can we get the ability to set ti to true or false? That would be awesome. [Next page](https://forum.bubble.io/t/free-plugin-particles-js/84231.md?page=2)