ThreeDotLoader

A simple general purpose loading animation that is meant to be used consistently throughout the application. It comes in different sizes and its color can be customized.

It is primarily meant to be used either standalone as the big version to indicate that the whole page is loading, or inside a button to indicate that the users input is being sent to the server.

Sizes

Color Variants

Accesibility

In order to inform the screen render that loader is active you need to pass loadingText as a prop to the element and the text will be announced when the loading indicator becomes active.

Props

ThreeDotLoader.Centered

If there is a need to place the loader into the box or into the page content use ThreeDotLoader.Centered. It aligns the loader to the center and keeps some minimum vertical spacing.

Props