Usando html2canvas para gerar uma imagem "pixelada" (nítida), e não desfocada

screenshot-avatar.js

let baixarEl = document.querySelector('#baixar');
let avatarEl = document.querySelector('#avatar-preview');
baixarEl.addEventListener('click', function(e) {
  html2canvas(avatarEl, {
    onrendered: function(canvas) {
      let contextoGrafico = canvas.getContext('2d');
      contextoGrafico.webkitImageSmoothingEnabled = false;
      contextoGrafico.mozImageSmoothingEnabled = false;
      contextoGrafico.imageSmoothingEnabled = false;

      let imagemCodificadaEmURL = canvas.toDataURL();
      let link = document.createElement('a');
      link.download = 'avatar.png';
      link.href = imagemCodificadaEmURL;
      document.body.appendChild(link);
      
      link.click();
    }
  });
});