Can this be done in Webflow, and what is the name of this effect, please?

Hello,

Can this be done in Webflow, and what is the name of this effect, please?

Here is the link to the website that has the background effect I am looking for to learn:

Now, I am just wondering two things:

  1. What is the name of this effect to research and learn more about it, and perhaps is this done in CSS/JS?

  2. Can this be done in Webflow since I am not a coder?

Thanks!
Regards,
BirdEye

Hi @BirdEye and welcome to the community.

You can achieve this effect with particle.js.
This website is really neat to configure your particle system : https://vincentgarreau.com/particles.js/

Here is a link to a cloneable project that demonstrate how to setup particles.js
https://webflow.com/website/Tutorial-How-to-integrate-Particlesjs-in-Webflow

You can then copy the parameters you’ll have generated from the first website listed in the parenthesis of the code snippet right after particlesJS("particles-js",

1 Like

Hello ColibriMedia,

I appreciate the kind words. Believe it or not, I found particle.js while creating this topic but what I wanted to know is if this is something possible using only Webflow rather than particle.js?

One thing that I do not know about particle.js is its license text. It says we need to add it to our project. Where would I add that text in Webflow, and does it need to be visible on my website? Can it be hidden within the code somewhere?

Thanks!
Regards,
BirdEye

Actually you could do that with Webflow interactions alone but it would not be as optimized and easy as an existing javascript library such as particle.js.

You could also use a lottie animation made in After Effects and import it in Webflow using the lottie animation component.

What you mean about license text ? The license text is embedded in the CDN source script file, no need to worry about that I guess.

Hello again,

I understand now. I think I will use that then. What I meant by that is this:

Thanks!
Regards,
BirdEye

Yes and if you go to the source of the script file https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js

The credits and license info are in there as well.

I think I will use that particles.js. Thank you!