JSFiddle - React, Tailwind, and code Playground

by velmurugansp

HTML

<div class="holder">
  <div class="line-1"></div>

  <div class="line-2"></div>

  <div class="line-3"></div>

  <div class="line-4"></div>
</div>

CSS

.holder{
  position: relative;
}
.line-1{
  width: 200px;
  height: 2px;
  background: #000;
  position: absolute;
  top: 100px;
  left: 100px;
}
.line-2{
    width: 120px;
    height: 2px;
    background: #000;
    position: absolute;
    top: 48px;
    left: -6px;
    transform: rotate(40deg);

}
.line-3{
    width: 120px;
    height: 2px;
    background: #000;
    position: absolute;
    top: 48px;
    left: 301px;
    transform: rotate(-40deg);
}
.line-4{
  width: 400px;
  height: 2px;
  background: #000;
}