Spinner
A loading indicator with three sizes shown in one preview. The markup stays compact, and the size variants are handled entirely in CSS.
Preview
Implementation Notes
One base class defines the animation and shell. Size modifiers only change diameter and stroke thickness, so the preview can present all sizes at once.
Browser Compatibility
| Feature | Chrome | Edge | Firefox | Safari | Notes | Source |
|---|---|---|---|---|---|---|
@keyframes
Broad support
|
Yes | Yes | Yes | Yes | The spinner relies on CSS animation and border styling only. | caniuse |