HTML+JS Supa-Cool Progbar

css

#o{
width: 200px;
height: 20px;
box-shadow: 0 0 1px gray;
}
#i{
background: -webkit-repeating-linear-gradient(-45deg, rgba(157,213,58,1) 0,rgba(161,213,79,1) 15,rgba(128,194,23,1) 16,rgba(124,188,10,1) 30);
height: 20px;
}

html+inline js

<input min=0 max=100 type=number onchange="t=this;i.style.width=t.value+'%';i.style.webkitFilter='hue-rotate('+t.value+'deg)';">
<br><br>
<div id="o"><div id="i" style="width: 75%; -webkit-filter: hue-rotate(75deg)"></div></div>