body { background : #ededf0; } input[type=range] { -webkit-appearance: none; background: linear-gradient(to right, rgba(175, 175, 175, 0.3) 0%, rgba(175, 175, 175, 0.3) 100%); background-position: center; background-size: 99% 4px; background-repeat: no-repeat; -webkit-appearance: none; width: 450px; height: 36px; border-radius: 1px; overflow: hidden; margin-top: 5px; margin-bottom: 5px; } input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; }
<input name="jim" id="jim" type="range" min="0" max="100" value="0">