CSS set element size in real pixels, not device pixel

Issue

window.setTimeout(function() {
  html2canvas(document.querySelector("#a")).then(function(canvas) {
    canvas.toBlob(function(aBlob) {
      var a = document.createElement('a'),
        b = URL.createObjectURL(aBlob);
      a.setAttribute('download', 'captured_image.png');
      a.setAttribute('href', b);
      a.click();
    });
  });
}, 1000);

<div id="a" style="width: 100px; height: 100px; background-color: yellow; box-sizing: border-box; border: 1px solid red;">
  This is 100px div
</div>

<script src="https://cdnjs.cloudflare.com/ajax/libs/html2canvas/1.4.0/html2canvas.min.js"></script>

(Because of cross origin it will not work on stackoverflow but in localhost it works but if you use hi-res display downloaded image will be 200px not 100px)

I am generating "screenshot" of page displayed in iframe and I always want it to be fixed size 100x100 pixels. It works on my PC but when I run the code at high resolution computers, downloaded image is bigger than 100x100 (e.g. 200x200). I think it's because of the device pixels are bigger, but how can I set it to be in pixels? My current code is:

iframe {
  width: 100px;
  height: 100px;
}

Is it possible to ignore device pixels and force to use normal pixels?

Edit: working solution by JHeth comment below: html2canvas(element, {scale:1}).then(...)

Solution

html2canvas(element, {scale:1}).then(...)

Answered By - asdjfiasd