JSFiddle - React, Tailwind, and code Playground
HTML
<svg height="750" width="640" style="overflow: visible" baseProfile="full" version="1.1" xmlns:ev="http://www.w3.org/2001/xml-events" xmlns:xlink="http://www.w3.org/1999/xlink" xmlns="http://www.w3.org/2000/svg"><defs><pattern patternContentUnits="objectBoundingBox" height="0.48" width="1" id="black_h"><image height="0.48" width="1" y="0" x="0" xlink:href="http://newlini.lokal/img/svg/black_h.png"/></pattern><pattern patternContentUnits="objectBoundingBox" height="1" width="0.48" id="black_v"><image height="1" width="0.48" y="0" x="0" xlink:href="http://newlini.lokal/img/svg/black_v.png"/></pattern><pattern patternContentUnits="objectBoundingBox" height="0.48" width="1" id="green_h"><image height="0.48" width="1" y="0" x="0" xlink:href="http://newlini.lokal/img/svg/green_h.png"/></pattern><pattern patternContentUnits="objectBoundingBox" height="1" width="0.48" id="green_v"><image height="1" width="0.48" y="0" x="0" xlink:href="http://newlini.lokal/img/svg/green_v.png"/></pattern><pattern patternContentUnits="objectBoundingBox" height="0.48" width="1" id="red_h"><image height="0.48" width="1" y="0" x="0" xlink:href="http://newlini.lokal/img/svg/red_h.png"/></pattern><pattern patternContentUnits="objectBoundingBox" height="1" width="0.48" id="red_v"><image height="1" width="0.48" y="0" x="0" xlink:href="http://newlini.lokal/img/svg/red_v.png"/></pattern><pattern patternContentUnits="objectBoundingBox" height="0.48" width="1" id="yellow_h"><image height="0.48" width="1" y="0" x="0" xlink:href="http://newlini.lokal/img/svg/yellow_h.png"/></pattern><pattern patternContentUnits="objectBoundingBox" height="1" width="0.48" id="yellow_v"><image height="1" width="0.48" y="0" x="0" xlink:href="http://newlini.lokal/img/svg/yellow_v.png"/></pattern></defs><line stroke-width="3" stroke="#e8e8e8" y2="374" x2="160" y1="374" x1="0"/><line stroke-width="3" stroke="#e8e8e8" y2="215" x2="319" y1="0" x1="319"/><line stroke-width="3" stroke="#e8e8e8" y2="374" x2="480" y1="374"...