Slider

An input for choosing a value from a range. The thumb swells slightly when grabbed, so touch targets feel tactile.

tsx
import { Slider } from "@/registry/seam/ui/slider"

export default function SliderDemo() {
  return (
    <div className="w-full max-w-xs">
      <Slider defaultValue={50} max={100} step={1} />
    </div>
  )
}
bunx --bun @seamui/cli@latest add slider

Notes

  • On press/drag the thumb rises to depth.raised — a physical “grab” cue that settles on release (most controls recede; the slider thumb lifts).
  • Controlled via value / onValueChange, uncontrolled via defaultValue; keyboard supports arrows plus Home/End.

Press feedback, reduced motion, and haptics follow the global policy — see Motion and Haptics.