JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://rawgit.com/niklasvh/html2canvas/master/dist/html2canvas.js"></script>
<div id="importance" class="importance3 " >
<img src="http://www.pngmart.com/files/4/Cube-PNG-HD.png" height="42" width="42"/>
</div>

<br/>
<br/>
<br/>
<br/>-------- GENERATED CANVAS OUTPUT------
<div style="margin: 40px;" id="canvasImg"></div>

CSS

.importance3{

    background-repeat: no-repeat;
    width: 20px;
    height: 20px;
    background-size: 20px 20px;
    display: inline-block;
    
    -webkit-transform: scale(2,2);
		-ms-transform: scale(2,2);
		transform: scale(2,2);
		-webkit-transform-origin: top left;
		-ms-transform-origin: top left;
		transform-origin: top left;
}

JavaScript

html2canvas($('#importance'), {
    height: 1540,
    width: 1540,
    onrendered: function (canvas) {
        
        $('#canvasImg').html(canvas);
    },
    useCORS: true,
    logging: true
});