<a id="loading"></a>

## Loading  
**Category**: Feedback
Indicators for loading states and progress
### Examples

#### Color Customization  
```python
Span(cls='loading loading-spinner text-primary'),
Span(cls='loading loading-spinner text-secondary'),
Span(cls='loading loading-spinner text-accent'),
Span(cls='loading loading-spinner text-neutral'),
Span(cls='loading loading-spinner text-info'),
Span(cls='loading loading-spinner text-success'),
Span(cls='loading loading-spinner text-warning'),
Span(cls='loading loading-spinner text-error')
```

#### Basic Spinners  
```python
Span(cls='loading loading-spinner loading-xs'),
Span(cls='loading loading-spinner loading-sm'), 
Span(cls='loading loading-spinner loading-md'),
Span(cls='loading loading-spinner loading-lg')
```

#### Dots Animation  
```python
Span(cls='loading loading-dots loading-xs'),
Span(cls='loading loading-dots loading-sm'),
Span(cls='loading loading-dots loading-md'),
Span(cls='loading loading-dots loading-lg')
```

#### Circular Ring  
```python
Span(cls='loading loading-ring loading-xs'),
Span(cls='loading loading-ring loading-sm'),
Span(cls='loading loading-ring loading-md'),
Span(cls='loading loading-ring loading-lg')
```

#### Ball Animation  
```python
Span(cls='loading loading-ball loading-xs'),
Span(cls='loading loading-ball loading-sm'),
Span(cls='loading loading-ball loading-md'),
Span(cls='loading loading-ball loading-lg')
```

#### Bars Animation  
```python
Span(cls='loading loading-bars loading-xs'),
Span(cls='loading loading-bars loading-sm'),
Span(cls='loading loading-bars loading-md'),
Span(cls='loading loading-bars loading-lg')
```

#### Infinity Animation  
```python
Span(cls='loading loading-infinity loading-xs'),
Span(cls='loading loading-infinity loading-sm'),
Span(cls='loading loading-infinity loading-md'),
Span(cls='loading loading-infinity loading-lg')
```