Slider

A Slider allows users to choose from a range of continuous and discrete values. The Slider displays the range of possible values and the Slider’s indicator displays the current value.

Rules of Thumb

Use a slider:

  • When users need to set defined, contiguous values (like volume or brightness), or a range of discrete values (like screen resolution).
  • To display abstracted values like “Low, Medium,” or “High.”
  • To reflect discrete numeric values by adding labels.
  • To give users immediate feedback on selection such as screen contrast.

Examples

slider do

slider do

Do: If adding labels, only use the minimal amount necessary to indicate the values.

slider dont

slider dont

Don’t: Excessive labels clutter the design.

×