# Primary color
Range slider is used to select a value by sliding a handle.
| Class name | Type | |
|---|---|---|
| range | Component | Range input |
| range-primary | Modifier | Adds `primary` to range |
| range-secondary | Modifier | Adds `secondary` to range |
| range-accent | Modifier | Adds `accent` to range |
| range-success | Modifier | Adds `success` to range |
| range-warning | Modifier | Adds `warning` to range |
| range-info | Modifier | Adds `info` to range |
| range-error | Modifier | Adds `error` to range |
| range-lg | Responsive | Large range |
| range-md | Responsive | Medium range (default) |
| range-sm | Responsive | Small range |
| range-xs | Responsive | Extra small range |