carbon-components/html/slider/slider.html

Carbon Components is a component library for IBM Cloud

<div class="bx--form-item">
  <label for="slider" class="bx--label">Slider label</label>
  <div class="bx--slider-test">
  <div class="bx--slider-container">
    <span class="bx--slider__range-label">0</span>
    <div class="bx--slider" data-slider data-slider-input-box="#slider-input-box">
      <div class="bx--slider__track"></div>
      <div class="bx--slider__filled-track"></div>
      <div class="bx--slider__thumb" tabindex="0"></div>
      <input id="slider" class="bx--slider__input" type="range" step="1" min="0" max="100" value="50">
    </div>
    <span class="bx--slider__range-label">100</span>
    <input id="slider-input-box" type="number" class="bx--text-input bx--slider-text-input" placeholder="0">
  </div>
</div>