react-loader-spinner provides simple React SVG spinner components which can be implemented for async/await operations before data loads in the view.

Installation

npm install react-loader-spinner --save
# or
yarn add react-loader-spinner

Documentation:

1. Getting Started
2. Spinners
3. Code Sandbox Example

Usage

No css import is required

import { Audio } from 'react-loader-spinner';

<Audio
  height="80"
  width="80"
  radius="9"
  color="green"
  ariaLabel="loading"
/>
  wrapperStyle
  wrapperClass
/>

Individual (deep) imports

Each loader can also be imported directly (useful for some bundlers / tree‑shaking scenarios):

import { Audio } from 'react-loader-spinner/audio'

// other examples:
// import { Oval } from 'react-loader-spinner/oval'
// import { ThreeDots } from 'react-loader-spinner/three-dots'

License

MIT

Contributors