Thumbprint logo

Loader Dots

Loading indicator with three animated dots

Loader Sizes

Default

<LoaderDots size="medium" />

Small
<LoaderDots size="small" />

Loader colors
This loader is available in multiple colors for use on elements with a non-white background.
Brand
<LoaderDots theme="brand" />

Inverse
<LoaderDots theme="inverse" />

Muted
<LoaderDots theme="muted" />

Props
LoaderDots
  • assistiveText
    Text that describes the current status and is only visible to
screenreaders.
    

    Type
    string
    Default
    'Loading'
  • size
    Controls the size of the dots.
    

    Type
    'small' | 'medium'
    Default
    'medium'
  • theme
    Changes the dot colors.
    

    Type
    'brand' | 'inverse' | 'muted'
    Default
    'brand'