JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cdn.jsdelivr.net/npm/[email protected]/dist/html2canvas.min.js"></script>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.css">
<body>
    <div id="content1">
        <p><i class="fa fa-user fa-lg"></i> fa-camera-retro</p>
    </div>
    <br><br><br>
        <button id="generateImage">Click to generate Image</button>
    <p>Image from html2canvas:</p>
     
</body>

JavaScript

$(function() {
    $('#generateImage').click(function() {
        html2canvas($('#content1').get(0)).then(function(canvas) {
          $('body').append(canvas);
        });
    });
});