UI / Components / foundations / Slider

Slider

Range input with brand-color track.

Single-thumb range slider. Brand-color filled track. Value rendered inline as a small badge so users see the exact number while dragging.

$npx dock-ui add slider

Usage

import { Slider } from "@/components/ui/slider";

<Slider value={v} onValueChange={setV} min={0} max={100} step={1} />

Install

via CLI
$ npx dock-ui add slider
Writes the file(s) directly to your components/ui/ folder. You own the code.
For agents
curl -L https://ui.trydock.ai/r/slider.json
Returns a JSON manifest with file paths + contents. Agent-readable, LLM-fetchable.
← All components
Themes·Component kit · glossary
View on GitHub →