Javatpoint Logo
Javatpoint Logo

Materialize CSS Preloader (Progress bar)

Preloader is used when you have content that will take a long time to load, so we provide a number activity + progress indicators.

Materialize provides various CSS classes to apply various predefined visual and behavioral enhancements to display various types of preloaders or progress bars. The following table mentions the available classes and their effects.

Index Class name Description
1) progress It is used to identify an element as a progress component. Required for div element.
2) determinate It is used to set the basic materialize behavior to progress indicator.
3) indeterminate It is used to set animation to progress indicator.


Let's take an example to demonstrate preloader (progress bar) in Materialize CSS:

Test it Now


Materialize PreLoader 1

Youtube For Videos Join Our Youtube Channel: Join Now


Help Others, Please Share

facebook twitter pinterest

Learn Latest Tutorials


Trending Technologies

B.Tech / MCA