Skip to content 
Loading
Loading
Loader
The loader animation is useful to notify users of the background process that might take a few moments before showing the information they requested. The spinning loader has two variants, one for light background and another for a darker background.
UX/UI Guidelines
Check the design documentation of the component in ZeroHeight.
From Figma to code
...
Customization
INFO
Check everything about the customization mechanics in the "How it works" documentation.
| CSS Variable | Type | Description |
|---|---|---|
--z-loader--stroke | distance | ... |
--z-loader--size | distance | ... |
--z-loader--color | color | Loader color |
--z-loader--fill | color | Loader fill |
The stroke, size, color and fill of the loader can be customized using the --z-loader--color, --z-loader--size, --z-loader--stroke and --z-loader--fill CSS custom properties respectively or the custom attribute.