Loading
Spinners, skeleton placeholders, and progress indicators for asynchronous states.
Spinners
Available in multiple sizes and colors.
LoadingLoadingLoadingLoadingLoading
LoadingLoading
Loading
LoadingLoadingLoadingSpinner with Custom Label
A spinner can display a descriptive label alongside it.
Processing your request
Skeleton — Text
Text skeletons simulate lines of content loading.
Loading content
Loading content
Loading content
Skeleton — Shapes
Circular, rectangular, and rounded skeleton placeholders.
Loading content
Loading content
Loading content
Skeleton — Static
A skeleton with animation disabled.
Loading content
Skeleton — Composite
A realistic card-like skeleton layout combining multiple variants.
Loading content
Loading content
Loading content
Progress Bar — Determinate
Progress bars at various completion levels with visible values.
Not started0%
Not started
Quarter done25%
Quarter done
Halfway there50%
Halfway there
Almost done75%
Almost done
Complete100%
Complete
Progress Bar — Colors
Progress bars in all available color variants.
Primary
Primary
Success
Success
Warning
Warning
Danger
Danger
Info
Info
Accent
Accent
Progress Bar — Sizes
Progress bars in all available sizes.
Extra small
Extra small
Small
Small
Medium
Medium
Large
Large
Progress Bar — Indeterminate
An indeterminate progress bar for unknown durations.
Loading...
Loading...
Progress Bar — Interactive
Use the buttons to increment or decrement the progress value.
Interactive progress30%
Interactive progress