Закруглить края у border?

Question

[Владимир Куц]

body {
    background-color: grey;
}

.easy-line {
    display: inline-block;
    margin: 0;
    background: transparent;
}

.easy-line:after {
    display: block;
    content: '';
    padding-top: 8px;
    border-bottom: solid 4px #fff;
    background: transparent;
    -moz-transform: scaleX(0.3);
    -webkit-transform: scaleX(0.3);
    -o-transform: scaleX(0.3);
    -ms-transform: scaleX(0.3);
    transform: scaleX(0.3);
    transition: transform 0.3s ease-in-out;
}

.easy-line.fromLeft:after {
    transform-origin: 0% 50%;
}

.easy-line:hover:after {
    transform: scaleX(1);
}

<div class="easy-line fromLeft">Какой-то текст</div>

jsfiddle
Вопрос очень простой - как закруглить начало и конец линии?

Answer 1

[Максим]

Не люблю когда делают тёмный фон , по вопросу : https://codepen.io/LenskyUser/pen/BZjLZq?editors=0110

Answer 2

[Артем Волков]

Простое правило
border-radius: 10px;
А если сделать круг тогда так:
<div class="my"></div>

.my{
/*** Меняйте размеры и смотрите ***/
width: 100px; 
height: 100px;
border-radius: 50%;
/** Или каждый угол закруглить по разному
border-radius: 10px 15px 5px 25px;
**/
}