Basic


Simply, include <canvas class="constellation"></canvas> inside your section.

Custom color


Add a data-color attribute with your desire color value. It supports HEX, RGB, and RGBA values.

Length


Define number of stars by adding data-length="300". Default is 150.

Radius


Define effective radius of mouse cursor by adding data-radius="300". Default is 150.

Over Container


As you can see in the above examples, the stars won't connect together when your cursor moves on the content. That's because .container has relative position. Simply add .position-static to the container to change this behavior. Please notice that this can cause some problems if you also have .overlay or video background in your section.