自定义鼠标样式

<div id="g-pointer"></div>

* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

html, body {
    height: 100%;
    box-sizing: inherit;
}

body {
    cursor: none;
    background-color: #fff;
}
#g-pointer {
    position: absolute;
    top: 0;
    left: 0;
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background-color: antiquewhite;
    background-image: url('https://gimg2.baidu.com/image_search/src=http%3A%2F%2Fc-ssl.duitang.com%2Fuploads%2Fitem%2F202003%2F31%2F20200331111100_stcys.thumb.400_0.jpeg&refer=http%3A%2F%2Fc-ssl.duitang.com&app=2002&size=f9999,10000&q=a80&n=0&g=0n&fmt=auto?sec=1666960103&t=10f775fd7b37480508d3ce9935002912');
    background-size: 100% 100%;
    border: 8px solid rgb(244, 185, 0);
    z-index: 1;
}

#g-pointer::before {
    content: '';
    position: absolute;
    top: -32%;
    left: -32%;
    width: 0;
    height: 0;
    border-top: 7px solid transparent;
    border-right: 14px solid rgb(244, 185, 0);
    border-bottom: 7px solid transparent;
    transform: rotate(45deg);
}

const element = document.getElementById("g-pointer");
const body = document.querySelector("body");

function setPosition(x, y) {
  element.style.transform  = `translate(${x}px, ${y}px)`;                
}

body.addEventListener('mousemove', (e) => {
  window.requestAnimationFrame(function(){
    setPosition(e.clientX - 5, e.clientY - 5);
  });
});