Ω SliderKnob

Base: The base shape given to the grab knob of the slider. Here we define the different look and size of the knob.

Styleguide Link

Properties

Shape

Circle: The default knob for the slider is a simple circle that can be drug to different locations along the track of the slider to set a value.

Box: A square with rounded corners

Triangle: A pointing triangle that could be used along with the tics (outside of the track).

Rectangle, Pill, Pentagon: Taller knobs to make the sliders grab area stand out a little more.

Size

For different slider sizes there's the need for different sizes of knob to proportionally align with the size of the slider track.

Last updated