---
url: /components/loading-indicator/overview.md
description: Loading indicators show the progress of a process for a short wait time
---

# Loading indicator

Loading indicators show the progress of a process for a short wait time

**Overview** · [Specs](specs.md) · [Guidelines](guidelines.md) · [Accessibility](accessibility.md)

![Loading indicator](/assets/9db90a3a-mroll4xd-loading-indicator.Bz8KK3or.webp)

* Recommended as a replacement for indeterminate [circular progress indicators](../progress-indicators/guidelines.md "Circular progress indicators display progress by animating along an invisible circular track in a clockwise direction.")
* Always reflect an ongoing process and are never simply decorative
* Used for pull-to-refresh interactions
* Not used for processes that transition from indeterminate to determinate  
* Capture attention through motion

<video controls src="https://firebasestorage.googleapis.com/v0/b/design-spec/o/projects%2Fgoogle-material-3%2Fimages%2Fm0fcl84h-Loading-Indicator-Overview-A-Sync.mp4?alt=media" aria-label="A looping sequence of morphs between 7 different shapes in a darker color, sitting on a circular background container in lighter color."></video>

1. Loading indicator
2. Contained loading indicator

## Availability & resources

| Type | Resource | Status |
| --- | --- | --- |
| Design | [Design Kit (Figma)](https://www.figma.com/community/file/1035203688168086460) | Available |
| Implementation | [Jetpack Compose: Expressive](https://developer.android.com/reference/kotlin/androidx/compose/material3/package-summary#LoadingIndicator\(androidx.compose.ui.Modifier,androidx.compose.ui.graphics.Color,kotlin.collections.List\)) | Available |
| Implementation | [Android Views (MDC-Android): Expressive](https://github.com/material-components/material-components-android/blob/master/docs/components/LoadingIndicator.md) | Available |
| Implementation | Web: Expressive | Unavailable |

## M3 Expressive update

**May 2025**

The loading indicator is designed to show progress that loads in under five seconds. It should replace most uses of the indeterminate circular progress indicator. [More on M3 Expressive](https://m3.material.io/blog/building-with-m3-expressive)

New component added to catalog.

Loading indicators:<br>

* Are used in pull-to-refresh functionality
* Can be contained or uncontained
* Use shape and motion to capture attention
* Can scale in size

<video controls src="https://firebasestorage.googleapis.com/v0/b/design-spec/o/projects%2Fgoogle-material-3%2Fimages%2Fm0fcq8u9-Loading-Indicator-Overview-B.mp4?alt=media" aria-label="Loading indicator in news app with pull-to-refresh."></video>

Loading indicators are used in the pull-to-refresh behavior