Background image looks blurry

[Lollichkeit]

This is my code and I don't know why the background image looks blurry:

var element = document.getElementById('elementID');
var e = element.cloneNode(true)
e.classList.add("pdf");
var opt = {
  margin:       0.25,
  filename:     'test.pdf',
  image:        { type: 'jpg', quality: 1},
  html2canvas:  {
      dpi: 600,
      scale:4,
      letterRendering: true,
      useCORS: true,
      width: 630, height: 891
  },
  jsPDF: { unit: 'mm', format: 'A4', orientation: 'p' }
};

html2pdf().set(opt).from(e).save();

I have several items with background images:

<div style="background-image: url('...')"></div>

[insaurabh]

Same for me

function generatePDF(data) {
    const { current_user, content, name } = data;
    const opt = {
        filename: `${name.toLowerCase().split(' ').join('-')}.pdf`,
        image: { type: 'jpeg', quality: 1 },
        html2canvas: {
            scale: 2,
            useCORS: true // required for assets coming from URL
        },
        jsPDF: {
            unit: 'mm',
            // format: 'letter',
            format: [216, 279],
            // hotfixes: ['px_scaling'],
            orientation: 'p'
        }
    };

    html2pdf().from(content).set(opt).save();
}