Slider

A slider is a horizontal bar that you can drag left or right to select a value within a range, similar to adjusting volume.

Installation

CLI

Manual

In the terminal, run the following command to begin:

npx hq-kit add slider

Preview

Code

Volume0

Preview

Code

Step Slider0

Step in 10

By passing an array to the defaultValue or value props, you can create a range slider.

Preview

Code

Slider Range25 – 75

Preview

Code

Temperature31

Current temperature: 31

Saturation21 – 86

Current saturation: 21,86

Preview

Code

Equilizer

Preview

Code

Volume0