Slider
Single-thumb slider with pointer drag and keyboard control (arrows, PageUp/Down, Home/End), steps and disabled state.
Copy a prompt for your AI coding tool with the source, dependencies and usage
Props
SliderProps
Also accepts all props of Omit<React.ComponentProps<"div">, "onChange" | "defaultValue">
| Prop | Type | Default | Description |
|---|---|---|---|
| value | number | — | — |
| defaultValue | number | 0 | — |
| onValueChange | (value: number) => void | — | — |
| min | number | 0 | — |
| max | number | 100 | — |
| step | number | 1 | — |
| disabled | boolean | false | — |
Install
$ npx shadcn@latest add https://chromotion.dev/r/slider.json