JSFiddle - React, Tailwind, and code Playground

HTML

<script src="https://cburgmer.github.io/rasterizeHTML.js/rasterizeHTML.allinone.js"></script>
<canvas id="canvas" width="300" height="200" style="border: 1px solid black;"></canvas>

<div id="thehtml" style="display: none;">
    <style>
        .test {
          font-size: 20px;
          background-color: yellow;
        }
    </style>
    <div class="test">Render this</div>
</div>

JavaScript

var canvas = document.getElementById("canvas"),
    context = canvas.getContext('2d'),
    html_container = document.getElementById("thehtml"),
    html = html_container.innerHTML;

rasterizeHTML.drawHTML(html).then(function (renderResult) {
    context.drawImage(renderResult.image, 10, 25);
});