HELO
i want to make line below text like this
please teach me how to.
hr {
position: relative;
}
hr::before,
hr::after {
position: absolute;
bottom: 0;
left: 0;
height: 4px;
content: '';
opacity: .8;
}
hr::before {
background-color: rgba(0,0,0,0.25);
right: 0;
}
hr::after {
background-color: var(--primary);
right: calc(100% - 70px);
}
<hr>