Components
Loading preview...
An input where the user selects a value from within a given range.
npx shadcn@latest add https://21st.dev/r/sean0205/sliderimport { Slider, SliderThumb } from '@/components/ui/slider';
export default function SliderDemo() {
return (
<div className="flex flex-col gap-5 p-10 w-full mx-auto max-w-[600px] h-screen justify-center items-center">
<div className="w-full md:w-[400px]">
<Slider defaultValue={[50]} max={100} step={1}>
<SliderThumb />
</Slider>
</div>
</div>
);
}