<div id="cursor"></div>

#cursor {
  width: 200px;
  height: 200px;
  animation: 3s rotate infinite alternate;
  position: fixed;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

const svg = `<svg viewBox="-101 -101 404 404" xmlns="http://www.w3.org/2000/svg"> <defs> <path id="MyPath" d="m200 100a100 100 0 0 1-100 100 100 100 0 0 1-100-100 100 100 0 0 1 100-100 100 100 0 0 1 100 100z" fill="none" stroke-width="0" stroke="#000" /> </defs> <text style="font-size: 55px;"> <textPath href="#MyPath"> Сотрудники Сотрудники </textPath> <animateTransform attributeName="transform" attributeType="XML" type="rotate" from="0 101 101" to="360 101 101" dur="4s" repeatCount="indefinite"/> </text> <g stroke-linecap="round"> <path d="M30,105 160,105" stroke="#000" stroke-width="15"/> <path d="M110,60 160,105 110,150" fill="none" stroke="#000" stroke-width="15"/> </g> </svg>`;

cursor.innerHTML = svg;

window.addEventListener("mousemove", _event);

function _event(e) {
  let x = e.pageX;
  let y = e.pageY;

  cursor.style.left = `${x}px`;
  cursor.style.top = `${y}px`;
}