Range Slider

To be able to use the range slider in your application you will need to install the nouislider dependency with npm install nouislider.

All options and features can be found here.

Basic range slider

<div data-slider='{"js-name": "slider0","start": 50,"range": {"min": 0,"max": 100}}'></div>
<p demo-slider="slider0"></p>

That’s only the basic features and options of range slider. More possibilities can be found here.

Do you have a question? ask the community
Do you see a bug? open an issue on GitHub
Do you like Tabler? tweet about it!
Support Tabler's development: Github Sponsors
illustrations banner imageillustrations banner image dark
65 sleek illustrations for your startup's visual identity.