JSFiddle - React, Tailwind, and code Playground

HTML

<hr class="straight-line" />
<svg height="170" width="150" class="line1">
    <line fill="none" stroke="#496e97" stroke-miterlimit="10" x1="4" y1="70" x2="143" y2="172" stroke-dasharray="5,5" />
</svg>

CSS

.straight-line{
    width: 150px;
    border-top: 1px dotted #496e97;
    
    /* Just to show it near svg */
    position: absolute;
    top: 65px;
}