Spinner

Border

<c-bs-spinner animation="border" />

Preview:

Grow

<c-bs-spinner animation="grow" />

Preview:

Border Primary

<c-bs-spinner animation="border" variant="primary" />

Preview:

Border Secondary

<c-bs-spinner animation="border" variant="secondary" />

Preview:

Border Success

<c-bs-spinner animation="border" variant="success" />

Preview:

Border Danger

<c-bs-spinner animation="border" variant="danger" />

Preview:

Border Warning

<c-bs-spinner animation="border" variant="warning" />

Preview:

Border Info

<c-bs-spinner animation="border" variant="info" />

Preview:

Border Light

<c-bs-spinner animation="border" variant="light" />

Preview:

Border Dark

<c-bs-spinner animation="border" variant="dark" />

Preview:

Grow Primary

<c-bs-spinner animation="grow" variant="primary" />

Preview:

Grow Secondary

<c-bs-spinner animation="grow" variant="secondary" />

Preview:

Grow Success

<c-bs-spinner animation="grow" variant="success" />

Preview:

Grow Danger

<c-bs-spinner animation="grow" variant="danger" />

Preview:

Grow Warning

<c-bs-spinner animation="grow" variant="warning" />

Preview:

Grow Info

<c-bs-spinner animation="grow" variant="info" />

Preview:

Grow Light

<c-bs-spinner animation="grow" variant="light" />

Preview:

Grow Dark

<c-bs-spinner animation="grow" variant="dark" />

Preview:

Border Small

<c-bs-spinner animation="border" size="sm" />

Preview:

Grow Small

<c-bs-spinner animation="grow" size="sm" />

Preview:

Custom Label

<c-bs-spinner animation="border" label="Please wait..." />

Preview:

Custom Attrs

<c-bs-spinner animation="border" c-attrs="{'class': 'custom-class'}" />

Preview:

With Margin

<c-bs-spinner animation="border" />

Preview:

Custom Size Style

<c-bs-spinner animation="border" />

Preview: