Sliders

A slider allows users to manipulate a value or a range of values by sliding a handle along a track. This interaction lets users make adjustments within a defined range, such as selecting a price range, setting a numerical value, or adjusting settings like volume or brightness.

Sliders are typically composed of a track, representing the value range, and a movable handle that users can drag to a desired position. The handle's position corresponds to the selected value, providing immediate visual feedback.

When using sliders on mobile, make sure the thumb is large enough and easy to target and drag. Keep in mind that sliders might be considerably hard to control for people with motor disabilities. Additionally, they make it difficult to fine-tune very wide ranges of values, e.g., 100 to 30k.