Slider

Preview

'use client';

import { Slider } from '@/registry/san-francisco/ui/slider';

export default function SliderDemo() {
  return <Slider defaultValue={[50]} className="w-full max-w-xs" />;
}

Installation

bun

bunx shadcn@latest add @sft-ui/slider

Range

'use client';

import { Slider } from '@/registry/san-francisco/ui/slider';

export default function SliderDemoRange() {
  return <Slider defaultValue={[25, 75]} className="w-full max-w-xs" />;
}

API Reference

See the Base UI Slider documentation for the API reference.