<canvas id="Wow"></canvas>
body{display:flex; align-items:center; justify-content:center; height:100vh; background:#000;}
canvas{width:99vw; height:99vh;margin:0 auto; display:block; padding:0;}
jackHarnerSig();

    function canvasExample(){
        //identify the Canvas element via the DOM
        var canvas = document.getElementById("Wow");
        //checking for Canvas browser compatibility
        if(canvas.getContext){

										canvas.width = window.innerWidth;
canvas.height = window.innerHeight;
					//Use getContext to specify the rendering context
            var context = canvas.getContext('2d');

            //setting of color
            context.fillStyle = "black";
            //creating the rectangle
            context.fillRect(0,0,1920,1080);

      var context = canvas.getContext('2d');
      var centerX = canvas.width / 2;
      var centerY = canvas.height / 2;
      var radius = 3;
      var radiusMax = 0.5;
			var count = 500;
					var i = 0;
					
					while(i < count){
						
						var random = Math.random();
						var random2 = Math.random();
						var random3 = Math.random();
	
						var x = canvas.width* random;
						var y = canvas.height * random2;

						   context.beginPath();
      context.arc(x, y,  (radius * random3), 0, 2 * Math.PI, false);
      context.fillStyle = 'white';
      context.fill();

						i++;
						
					}

  

        }else{
            //providing a fallback option
            alert("Please a Canvas-Supporting Web Browser");
        }
    }

$().ready(function(){
	
	canvasExample();
});

External CSS

This Pen doesn't use any external CSS resources.

External JavaScript

  1. https://codepen.io/jackharner/pen/MGRbEJ.js
  2. https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.js