Notifications

A notification is a message object that presents timely information, including alerts, errors, reminders, cookie warnings, and requests.

Guidelines

Comparing components

Global notification: A global notification is always at the top of the screen and stretches the full width of the viewport. It is used for system-level notifications that inform the user about system status such as logging in and background processes like data imports.
Inline notification: Inline notifications appear within content areas as close as possible to the thing that it’s about. It is used for contextual information.
Toast notification: Toasts appear in the top–right (or top–left in right-to-left languages). It is used immediately after a specific event such as a user action that does not relate to an object on the page. For example, confirmation of deleted items.

For system based notifications, e.g. The server is down, use Global Notifications
For notifications which are relevant to a piece of content on the page, use Inline Notifications
For notifications which are temporary and need to provide visual feedback, use Toast Notifications