Vue Material -

Progress Spinner

Progress indicators are visual indications of an app loading content.

Progress spinners have 2 types for each operation that your application may need: Determinate or Indeterminate.

Progress Spinner

When indicators are determinate they indicate how long an operation will take when the percentage complete is detectable.


When indicators are indeterminate they request that the user wait while something finishes when it’s not necessary to indicate how long it will take.


You can always change the sizes and stroke with of a spinner to suit your needs:


API - md-progress-spinner

The following options can be applied to all progress spinners:

md-mode String Set the mode the progress. See below the detailed description of each mode. determinate
md-mode="determinate" String The default mode. Works along with md-value prop. Apply a 0% to 100% loading spinner. -
md-mode="indeterminate" String Create a indeterminate loading spinner -
md-value Number The current progress amount. From 0 to 100. null
md-diameter Number The diameter of the spinner in px. 60
md-stroke Number The stroke size. 6