# Slider.

## Overview

### What does the component do?

- The component is used to enter a value within a defined span.
- Icons at the beginning and end of the element inform about the defined span.

### When should the component be used?

- The component lets the user set which value corresponds to his wish.

### Rules

- The slider has a given number of choices.
- There is an icon at the beginning and at the end.

## Variants

### States

The component has the following states:

- Default
- Disabled

### Variants

#### Default

![Image of the slider](https://digital.sbb.ch/assets/images/mobile/slider-light.webp "Slider")

![Image of the slider](https://digital.sbb.ch/assets/images/mobile/slider-dark.webp "Slider")

### Specification

[Design](https://www.figma.com/design/ZBotr4yqcEKqqVEJTQfSUa/Design-System-Mobile?node-id=347-19701&t=N7M8b5Y9aIJc4LzY-1)

---

Source: https://digital.sbb.ch/en/design-system/mobile/components/slider/