Docs
Slider
Slider
An input where the user selects a value from within a given range.
Installation
npx nyxbui@latest add sliderUsage
import { Slider } from "~/components/ui/slider"<Slider defaultValue={[33]} max={100} step={1} />Examples
Default
Disabled
Inverted
Vertical
Range
Tick Marks
Use the showSteps prop to define tick marks' style.
NOTE: The tick marks' positions are not 100% accurate!
Half Tick Marks
Full Tick Marks
Format Label
Use the formatLabel prop to define how the value is shown on popover.
Format Label Side
Use the formatLabelSide prop to indicate where the popover will appear.