Gradient Horizontal Line

Demo and Code

Demo

HTML

<div id=”gradientLine”></div>

CSS
#gradientLine {
height: 2px;
width: 100%;
display: block;
background-color: background: #a90329;
background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…EiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
background: -moz-linear-gradient(left, #a90329 0%, #a3039d 44%, #1800a3 100%);
background: -webkit-gradient(linear, left top, right top, color-stop(0%,#a90329), color-stop(44%,#a3039d), color-stop(100%,#1800a3));
background: -webkit-linear-gradient(left, #a90329 0%,#a3039d 44%,#1800a3 100%);
background: -o-linear-gradient(left, #a90329 0%,#a3039d 44%,#1800a3 100%);
background: -ms-linear-gradient(left, #a90329 0%,#a3039d 44%,#1800a3 100%);
background: linear-gradient(to right, #a90329 0%,#a3039d 44%,#1800a3 100%);
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a90329', endColorstr='#1800a3',GradientType=1 );
}

Pin It on Pinterest