JSFiddle - React, Tailwind, and code Playground

HTML

<span id="circle" class="circle"></span>

CSS

body, html {
	position: relative;
	height: 1000px; 
	width : 100%;  
	margin: 0;
}

.circle {
	position: absolute;
  background: #000000;
  opacity: .075;
	width: 40px; 
	height: 40px; 
  border-radius: 50%;  
  pointer-events: none;
}

JavaScript

jQuery(document).ready(function() {

  var mouseX = 0, mouseY = 0;
  var xp = 0, yp = 0;
   
  $(document).mousemove(function(e){
    mouseX = e.pageX - 20;
    mouseY = e.pageY - 20; 
  });
    
   setInterval(function(){
    xp += ((mouseX - xp)/3);
    yp += ((mouseY - yp)/3);
	$("#circle").css('transform', 'translate(' + xp + 'px, ' + yp + 'px)');
    }, 20);

});