## Range
**Category**: Data Input
Slider control for selecting values within a specified range
### Examples
#### Basic Range
```python
Input(type='range', min='0', max='100', value='40', cls='range')
```
#### Color Variants
```python
Iput(type='range', min='0', max='100', value='40', cls='range range-primary'),
Input(type='range', min='0', max='100', value='40', cls='range range-secondary'),
Input(type='range', min='0', max='100', value='40', cls='range range-accent'),
Input(type='range', min='0', max='100', value='40', cls='range range-neutral'),
Input(type='range', min='0', max='100', value='40', cls='range range-info'),
Input(type='range', min='0', max='100', value='40', cls='range range-success'),
Input(type='range', min='0', max='100', value='40', cls='range range-warning'),
Input(type='range', min='0', max='100', value='40', cls='range range-error')
```
#### Size Variants
```python
Input(type='range', min='0', max='100', value='40', cls='range range-xs'),
Input(type='range', min='0', max='100', value='50', cls='range range-sm'),
Input(type='range', min='0', max='100', value='60', cls='range range-md'),
Input(type='range', min='0', max='100', value='70', cls='range range-lg'),
Input(type='range', min='0', max='100', value='80', cls='range range-xl'),
```
#### With Steps
```python
Input(type='range', min='0', max='100', value='25', step='25', cls='range'),
Div(
Span('|'),
Span('|'),
Span('|'),
Span('|'),
Span('|'),
cls='flex w-full justify-between px-2 text-xs'
)
```
#### Custom Color
```python
Input(
type='range',
min='0',
max='100',
value='40',
cls='range text-blue-300 [--range-bg:orange] [--range-thumb:blue] [--range-fill:0]'
)
```