Last Updated on Sep 29, 2022
Loaders inform the user of an extended latency in presenting content to the user. They are indeterminate progress indicators that can show in a container or full screen.

Design Principles

  • Loaders inform the user of loading or computing processes being carried out by the system. With a loader, no progression status is available.
  • If necessary, a loader could be used to to delay loading if content flashes in an unpleasant way. This should not be common, but is acceptable.

Do's and Don'ts

Use when loading content for an entire page, a modal, or other container.
Don’t use loaders unless absolutely necessary. Default to content loading instantly.