Great... thank you for the update!

Ciaran

Thank you it work

hr { height:5px; width:200px;
background-color: rgba(22,165,255,1); }

hr {
position: relative;
}
hr::before,
hr::after {
position: absolute;
bottom: 0;
left: 0;
height: 10px;
width:35%;
content: '';
opacity: 1;
}
hr::before {
background-color: rgba(0,0,0,0.25);
right: 0;
}
hr::after {
background-color: var(--primary);
right: calc(100% - 70px);
}

Hello

If you are using a code editor (eg. Codemirror) then simply use the hr tag...

<hr>

If using a WYSIWYG editor then look for a Horizontal Rule option.

Ciaran

hi
I have installed this code
but i dont know how to create this line in my article
Please tell me what to do.

thank you so much

Hello

This is untested but you can try applying this styling to the hr tab by adding the following to the Custom CSS field of your template settings...

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);

}

Ciaran