Color Slider

Slide through gradients, picking the intensity or shade you need, as smoothly as sliding into your favorite jeans.

Installation

CLI

Manual

In the terminal, run the following command to begin:

npx hq-kit add color-slider

Preview

Code

Default0°

Disabled0°

Preview

Code

Color Customizer0°

By default, the color slider is horizontal. You can change it to vertical by setting the orientation prop to vertical.

Preview

Code

0°

Preview

Code

216°

color: {"hue":216,"saturation":98,"lightness":52,"alpha":1}