LupineVault star background taken from Shadow Tunnel
Demo at GitHub Pages
Easy stars background with html, js, and css
To easily put a star background on any site, follow these instructions:
-
Right after the first
<body>
tag, paste<canvas id="canvas"></canvas>
-
Right before the last
</body>
tag, paste<script src="stars.js"></script>
-
In your CSS file, paste the following at the end:
/* Stars */
#canvas {
display: block;
position: fixed; /* Cover the viewport */
top: 0;
left: 0;
width: 100vw; /* 100% of the viewport width */
height: 100vh; /* 100% of the viewport height */
pointer-events: none; /* Prevents canvas from interfering with interactions */
}
-
Put the stars.js file in the same directory as the HTML file with the stars
-
Enjoy!