Tutorial de cursor personalizado con brillitos

 Olaa chicos, es mi primera vez haciendo tutoriales y este me lo pidio JImenita, este es el codigo: 

 <style>

  :root {

    --url-cursor: url('TU LINK');

    --color-brillito: #tucolor;

  }

  *, html, body, a, button, iframe, div, span {

    cursor: var(--url-cursor), auto !important;

  }

  

  a:hover, button:hover, input[type="submit"]:hover {

    cursor: var(--url-cursor), pointer !important;

  }

  .brillito {

    position: absolute;

    width: 6px;

    height: 6px;

    background-color: var(--color-brillito);

    border-radius: 50%;

    pointer-events: none;

    box-shadow: 0 0 4px var(--color-brillito), 0 0 8px var(--color-brillito); 

    animation: desvanecer 3s forwards ease-out;

    z-index: 999999;

  }

  @keyframes desvanecer {

    0% {

      opacity: 1;

      transform: scale(1) translateY(0);

    }

    100% {

      opacity: 0;

      transform: scale(0.2) translateY(25px);

    }

  }

</style>

<script>

  document.addEventListener('mousemove', function(e) {

    const brillito = document.createElement('div');

    brillito.className = 'brillito';

    

    brillito.style.left = (e.pageX - 3) + 'px';

    brillito.style.top = (e.pageY - 3) + 'px';

    

    const size = Math.random() * 5 + 2;

    brillito.style.width = size + 'px';

    brillito.style.height = size + 'px';

    

    document.body.appendChild(brillito);

    

    setTimeout(() => {

      brillito.remove();

    }, 3000);

  });

</script>

Primero cambiaremos el codigo, para poner la imagen tiene que ser un png o sea, una con fondo transparente y que sea de 32 x 32p empezaremos buscando nuestra imagen puede ser en pinterest o en donde quieran, preferentemente transparente pero si no con que tenga fondo blanco o se un solo color, ejemplo algo asi

Luego lo llevan a Remove bg que ahi le quitan el fondo si no es transparente, luego para llevarla a que sea las dimensiones adecuadas iremos a Esta pagina que se me olvido el nombre jsdfkjsf y ahi le ponen que sea 32 x 32px, por ultimo iremos a Post image en donde pondran su imagen y les saldran varias opciones, vayan a la que dicen "link directo" y la copian, porfin volvemos al codigo y arribita entre las comillas y parentesis importantisimo que no los borren dice "tu link" ahi lo pegan y listo, solo nos queda poner el color de los brillitos y ahi van a Html codes, escogen su colorcito y lo copian y pegan entre donde puse "tucolor2 igual no borren el # ni la ;

Ahora en diseño iremos a los gadgets y añadiremos un html code, pondremos nuestro codigo y ya quedaria, solo denle al cosito alado del ojo y ya

Eso fue todo, si falla o algo me dicen porque es mi primera vez haciendo tutoriales y en un blog, baii!