Slider

A slider provides a visual indication of adjustable content, as well as the current setting in the total range of content. Use a slider when you want people to set defined values (such as volume or brightness), or when people would benefit from instant feedback on the effect of setting changes.

Best practices

Layout

• Don't use a continuous slider if the range of values is large.

• Don't use a range with fewer than three values.

• Sliders are typically horizontal but can be vertical, when needed.

Content

• Include a label indicating what value the slider changes.

• Use points if you don't want the slider to allow arbitrary values between minimum and maximum.

Slider

States

Transitions

Transitions	Front View	Isometric View
Appear
Enter
Exit
Interact
Disappear