Login box over particles.js canvas

Basic login form in the foreground with particles.js in the background. As we hover over the particles, we will have the response that particles move out of the way. When we click on the background, it responds by creating more number of particles

---

This webpage is hosted on firebase. To see live-demo visit https://particlejseffect.firebaseapp.com

---

The default background picture/cover photo of any profile on LinkedIn uses Particle JS effect

---

Primefaces forum https://forum.primefaces.org/

---

Particle effect with circular particles

Particle effect with image as particles

---

About particles.js

Particles.js is a lightweight JavaScript library for creating particles

Particles.js is a standalone JavaScript library helps you create an animated & interactive Particle System that reacts to viewer's cursor

Particles.js => Go to JSDeliver.com and search for particles.js
   https://cdn.jsdelivr.net/particles.js/2.0.0/particles.min.js This link is to be included in the HTML file under script tag

Documentation of particles.js can be referred from Github page of particles.js

---

Important Note:

This program requires a server to run

Option 1: Use the node server

$npm install -g live-server

Running the program:
Go to project directory and type the command

$live-server

Option 2: If you are using atom text editor, install the plugin/package=> atom-live-server

Running the program

Go to Packages

Select atom-live-server

Select the option => Start server

---

Technology Stack

HTML5

particles.js

CSS

JSON

---

Text editor used: Atom