@patternfly/pfe-spinner

PatternFly Elements Spinner

pfe-spinner is used to indicate to users that an action is in progress.

Read more about Spinner in the PatternFly Elements Spinner documentation

Installation

Load <pfe-spinner> via CDN:

<script src="https://unpkg.com/@patternfly/pfe-spinner?module"></script>

Or, if you are using NPM, install it

npm install @patternfly/pfe-spinner

Then once installed, import it to your application:

import '@patternfly/pfe-spinner';

Usage

<pfe-spinner>Loading...</pfe-spinner>

Size variations

<pfe-spinner size="sm">Loading...</pfe-spinner>
<pfe-spinner size="md">Loading...</pfe-spinner>
<pfe-spinner size="lg">Loading...</pfe-spinner>
<pfe-spinner size="xl">Loading...</pfe-spinner>

Custom size

<pfe-spinner diameter="80px">Loading...</pfe-spinner>