JSFiddle - React, Tailwind, and code Playground

by NunoMira

HTML

<div style="position: relative; width: 500px; height: 500px; background-color: red">
<svg
style="position: absolute; bottom: 0px; right: 0px"
 height="100" width="100">
  <polygon points="100,100 0,100 100,0" style="fill:#4d4d4d;stroke:#4d4d4d;stroke-width:1" />
<line x1="70" y1="50" x2="70" y2="90" style="stroke:rgb(255,255,255);stroke-width:6" />
<line x1="50" y1="70" x2="90" y2="70" style="stroke:rgb(255,255,255);stroke-width:6" />
</svg>
<div>

CSS

.a
{
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 90px 90px 0px;
    border-color: transparent #007bff transparent transparent;
    position: relative;
}
.a:before
{
    position: absolute;
    right: -84px;
    top: -78px;
    content: "+";
    font-size: 90px;
    color: white;
}