JSFiddle - React, Tailwind, and code Playground

HTML

<html>
<head>
<script type="application/javascript">
"use strict";

function start() {
    var svgns = "http://www.w3.org/2000/svg";
    var svgField = document.createElementNS(svgns, "svg");
    svgField.setAttributeNS(svgns, "width", 300);
    svgField.setAttributeNS(svgns, "height", 300);
    svgField.setAttributeNS(svgns, "viewBox", "0 0 300 300")

    var svgBrick = document.createElementNS(svgns, "path");
    var svgBrickProp = "M 0,0 l 0,25 25,50 50,25 50,0 Z";
    svgBrick.setAttributeNS(svgns, "d", svgBrickProp);
    svgBrick.setAttributeNS(svgns, "stroke", "blue");
    svgBrick.setAttributeNS(svgns, "stroke-width", "3")

    svgField.appendChild(svgBrick);

    document.body.appendChild(svgField);

}
</script>
</head>
<body onload="start()">
</body>
</html>