Volume60%
components/slider

Slider

Range input with a filled track, value readout and disabled state.

Usageimport { Slider } from "./Slider";
1import { Slider } from "./Slider";
2 
3<Slider />

Copy the source with the toolbar’s copy button — or open the Code pane to select it by hand — then paste the file into your project. It is self-contained, with no registry metadata and no dependencies (Tailwind classes required).

Props

PropTypeDefault
labelstringVolume
value0 | 20 | 40 | 60 | 80 | 10060
showValuebooleantrue
disabledbooleanfalse