<pre>
<div class="color-line"></div>
<style>
.color-line{
background:#f7f9fa;
height:6px;
background-image:-webkit-linear-gradient(left,#34495e,#34495e25%,#9b59b6 25%,#9b59b635%,#3498db35%,#3498db45%,#62cb3145%,#62cb3155%,#ffb60655%,#ffb60665%,#e67e2265%,#e67e2275%, #e74c3c 85%, #e74c3c 85%, #c0392b 85%, #c0392b 100%);
background-image:-moz-linear-gradient(left,#34495e,#34495e25%,#9b59b6 25%,#9b59b635%,#3498db35%,#3498db45%,#62cb3145%,#62cb3155%,#ffb60655%,#ffb60665%,#e67e2265%,#e67e2275%,#e74c3c 85%, #e74c3c 85%, #c0392b 85%, #c0392b 100%);
background-image:-ms-linear-gradient(left,#34495e,#34495e25%,#9b59b6 25%,#9b59b635%,#3498db35%,#3498db45%,#62cb3145%,#62cb3155%,#ffb60655%,#ffb60665%,#e67e2265%,#e67e2275%,#e74c3c 85%, #e74c3c 85%, #c0392b 85%, #c0392b 100%);
background-image:linear-gradient(toright,#34495e, #34495e25%,#9b59b6 25%,#9b59b635%,#3498db35%,#3498db45%,#62cb3145%,#62cb3155%,#ffb60655%,#ffb60665%,#e67e2265%,#e67e2275%,#e74c3c 85%, #e74c3c 85%, #c0392b 85%, #c0392b 100%);
background-size:100%6px;
background-position:50%100%;
background-repeat:no-repeat;
}
</style>
</pre>