Thumbprint logo

Components

Loader Dots

Loading indicator with three animated dots.

Version:14.18.2 •View source•Changelog•Report issue
Install:yarn add @thumbtack/thumbprint-react
Import:import { LoaderDots } from '@thumbtack/thumbprint-react';

Loader Sizes

Default

  • Loading
Small
  • Loading
Loader colors
This loader is available in multiple colors for use on elements with a non-white background.
Brand
  • Loading
Inverse
  • Loading
Muted
  • Loading
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
    This prop can be one of the following 2 types:
    • 'small'
    • 'medium'
    Default
    'medium'
  • theme
    Changes the dot colors.
    Type
    This prop can be one of the following 3 types:
    • 'brand'
    • 'inverse'
    • 'muted'
    Default
    'brand'