- Docs
- components
- Slider
Slider
A slider allows a user to select one or more values within a range.
Preview
Code
Installation
CLI
Copy & Paste
npx @sly-cli/sly add jolly-ui slider
Note: Only the default style can be installed via CLI at the moment
Usage
Basic
Preview
Code
Value Label
Values are formatted as a percentage by default, but this can be modified by using the formatOptions prop to specify a different format. formatOptions is compatible with the option parameter ofs Intl.NumberFormat and is applied based on the current locale.
Preview
Code
Vertical
Sliders are horizontally oriented by default. The orientation prop can be set to "vertical" to create a vertical slider.
Preview
Code