forms range-slider

Range Slider

Single-thumb slider with tooltip + value formatting.

$ ndui add range-slider

Component docs

With value tooltip + suffix

Volume 60.00%

0% 100%

Budget $2500.00

$0 $10000

Distance 12.00 mi

1 mi 50 mi

Source

<noundry-range-slider label="Volume" min="0" max="100" value="60" value-suffix="%" show-tooltip="true" />
<noundry-range-slider label="Budget" min="0" max="10000" step="100" value="2500" value-prefix="$" color="green" />