> ## Documentation Index
> Fetch the complete documentation index at: https://docs.cognite.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Page loader

> Page loaders can be used as full page loaders, covering the entire page while content is loading or within the main content area.

## Page loader

<Badge color="blue">v1.0.0</Badge> | [View in Storybook](https://master--695bb4b1b8041ae09768950a.chromatic.com/?path=/docs/primitives-loader--docs)

### When to use

* When loading entire pages or the primary content area after a navigation action.
* When the content load time is noticeable (typically > 1s) and might cause uncertainty without visual feedback.
* During transitions between major sections of the product where the context completely changes, such as navigating to a new application or page.

### When to use something else

* For small, localized loads in [Menu](/aura-design-system/primitives/menu), [Button](/aura-design-system/primitives/button), [Card](/aura-design-system/primitives/card), [Data grid](/aura-design-system/primitives/data-grid) cells, or inline lists: use skeleton or inline spinner patterns instead.
* For background work while the user keeps working: use [Progress](/aura-design-system/primitives/progress) or a subtle inline status indicator.
* For imperceptibly fast loads (\< \~1s): skip the loader to avoid flicker.
* For long loads (> \~4s): prefer [Progress](/aura-design-system/primitives/progress) or explicit completion messaging.

### Behavior

* Covers the targeted region (full page or main pane) until loading finishes; should not steal focus unless paired with a cancelable operation that needs attention.

### Often used with

* Full-page or pane skeleton UI; for indeterminate waits pair messaging with [Progress](/aura-design-system/primitives/progress) when a % or cancel is available.