Range

A range slider is a control that enables users to choose a value from a continuous range of values.

Range with datalist for visual tick marks and labeled values, enabling users to see available options and precisely select predetermined values.

Range with combined step increments and datalist labels, ensuring precise value selection with clear visual indicators at each valid step position.

Range with defined step increments for discrete value selection, constraining the slider to specific intervals for controlled input precision.

Vertical layout configuration for stacked form arrangements, displaying label, slider, and message in a column format with support for states including disabled, success, and error feedback.

Horizontal layout configuration for inline form arrangements, positioning label and slider side-by-side for compact displays with support for states including disabled, success, and error feedback.

Vertical range slider for space-constrained layouts or controls where bottom-to-top value selection is intuitive, such as volume or equalizer adjustments.

Vertical range slider with datalist tick marks and labeled values for precise value selection in vertical layouts.

Range component can have its visual styles overwritten to achieve custom themes.