html - 将引导范围颜色更改为十六进制颜色？

Question

我正在寻找更改 Bootstrap 范围滑块的默认蓝色，但我不确定这是否可能。这是我到目前为止所拥有的小提琴。理想情况下，我想将其更改为十六进制颜色，例如红色。这可以用像 CSS 这样简单的东西来完成吗？

这是我的html代码：

<link href="https://cdnjs.cloudflare.com/ajax/libs/twitter-bootstrap/4.0.0-beta/css/bootstrap.min.css" rel="stylesheet" />

<!--  Age Range Slider  -->
<div class="col">
  <div class="card mb-3" style="max-width: 21rem;">
    <div class="card-body text-center">
      <div class="d-flex flex-column">
        <label for="age_slider" class="form-label"> Age</label>
        <input class="slider" name="age_slider" id="age_slider" type="range" value="30" max="100" min="1" oninput="this.nextElementSibling.value = this.value">
        <output>30</output>
      </div>
    </div>
  </div>
</div>

标签： htmlcssbootstrap-4