JSFiddle - React, Tailwind, and code Playground

by sandro_paganotti

HTML

<!doctype html>
<html>
    <head>
    </head>
    <body>
        <div></div>
    </body>
</html>

CSS

div{
    width: 500px;
    height: 300px;
    background-image: radial-gradient(ellipse farthest-corner at 10px 10px, white 30%, #999999 30%, #999999 50%, red 50%);
}

JavaScript

var d = document.querySelector('div');
d.addEventListener('mousemove', function(evt){
  console.log('move');  
  d.style.background = "radial-gradient(ellipse farthest-corner at "+ evt.clientX +"px "+ evt.clientY +"px, white, #999999)";  
}, false);