JSFiddle - React, Tailwind, and code Playground

by electronoob

HTML

weird noise thing
<canvas id="game" width="640" height="480"></canvas>

CSS

canvas {
  background-color: rgb(50, 50, 50);
  image-rendering: -moz-crisp-edges;
  image-rendering: -moz-crisp-edges;
  image-rendering: -o-crisp-edges;
  image-rendering: -webkit-optimize-contrast;
  -ms-interpolation-mode: nearest-neighbor;
}

body {
  color:#ffffff;
  background-color: #000
}

JavaScript

let game = document.getElementById('game');
let ctx = game.getContext('2d');

let c = 1000;
let radius = 200;
let derp = 0;
let draw = function() {
  ctx.clearRect(0, 0, game.width, game.height);
  for (i = 0; i < c; i++) {
  	let x = (Math.random()*100) ;
		let y = (Math.random()*100) ;

    x = Math.cos(x) * 400;
    y = Math.sin(y) * 400;
    
    //ctx.fillRect(x,y,2,2);
    
      ctx.beginPath();
      ctx.arc(x, y, 4, 0, 2 * Math.PI);
      ctx.fillStyle = 'blue';
      ctx.fill();
      ctx.lineWidth = 1;
      ctx.strokeStyle = '#000000';
      ctx.stroke();
     
  }

  window.requestAnimationFrame(draw);
};

draw();

setInterval(function(){
	derp+=0.001;
},1);