DOCS
v0.4

Components / Spinner

Spinner

CSS-only spinning loading indicator. 5 sizes, 3 colors, sr-only label.

feedbackv0.5.0

Playground

Examples

Sizes
<cg-stack direction="row" gap="md" align="center"><cg-spinner size="xs"></cg-spinner><cg-spinner size="sm"></cg-spinner><cg-spinner size="md"></cg-spinner><cg-spinner size="lg"></cg-spinner><cg-spinner size="xl" color="accent"></cg-spinner></cg-stack>

Import

import { CgSpinner } from '@cognivo/components';
// Or tree-shake: import '@cognivo/components/cg-spinner';

Per-component imports ship only that component (~8 kB gzip).

API Reference

PropTypeDefaultDescription
size"xs"|"sm"|"md"|"lg"|"xl""md"Size
color"default"|"accent"|"white""default"Color
labelstring"Loading"Screen reader label