#### Elevate Your Design with CoreUI PRO!

Unlock a world of possibilities: More themes, enhanced components (Date Picker, Multi Select, and more), and priority support.

Range

Create custom `<input type="range">` controls with `.form-range`.

Example range
Range Disabled

Add the `disabled` boolean attribute on an input to give it a grayed out appearance and remove pointer events.

Disabled range
Range Min and max

Range inputs have implicit values for `min` and `max`— `0` and `100`, respectively. You may specify new values for those using the `min` and `max` attributes.

Example range
Range Steps

By default, range inputs “snap” to integer values. To change this, you can specify a `step` value. In the example below, we double the number of steps by using `step="0.5"`.

Example range