JSFiddle - React, Tailwind, and code Playground
by confile
HTML
<div class="box" id="box1"></div>
<div class="box" id="box2"></div>
<div class="box" id="box3"></div>
<div class="line" id="line1"></div>
<div class="line" id="line2"></div>
CSS
.box{
border: 1px solid black;
background-color: #ccc;
width: 100px;
height: 100px;
position: absolute;
}
.line{
width: 1px;
height: 100px;
background-color: black;
position: absolute;
}
#box1{
top: 0;
left: 0;
}
#box2{
top: 200px;
left: 0;
}
#box3{
top: 250px;
left: 200px;
}
#line1{
top: 100px;
left: 50px;
}
#line2{
top: 220px;
left: 150px;
height: 115px;
transform: rotate(120deg);
-webkit-transform: rotate(120deg);
-ms-transform: rotate(120deg);
}