Horizontal slider
noUiSlider is a range slider without bloat. It offers a ton off features, and it is as small, lightweight and minimal as possible
Vertical slider
The orientation setting can be used to set the slider to "vertical" or "horizontal"
Values range
noUiSlider will keep your values within the slider range, which saves you a bunch of validation.
Value:
Slider handles
Value:
Value:
Connected Handles
The connect setting can be used to control the bar between the handles, or the edges of the slider
Value:
Value:
Connected Handles Variation
Value:
Value:
Slider with tooltip
noUiSlider can provide a basic tooltip without using its events system. Set the tooltips option to true to enable.
Color Variations
Tooltip slider with different color options, use class slider-* to quickly create a styled slider. Uses native boostrap colors scheme classes