Bootstrap5 Range

To set a range, addinputto the elementtype="range"and use the.form-rangeclass:

Range:

Example

<label for="customRange" class="form-label">Custom range</label> <input type="range" class="form-range" id="customRange">

Try it »

Step

By default, the step is 1, and it can be set using the step attribute:

Example

<input type="range" class="form-range" step="10">

Try it »

Max and Min Values

By default, the minimum value is 0 and the maximum value is 100, and they can be set using the min (minimum) or max (maximum) attributes:

Example

<input type="range" class="form-range" min="0" max="4">

Try it »
Other Extensions