Snackbar

Snackbars are non-modal, time-based elements used to display short messages. They usually appear at the bottom of the screen and disappear automatically in 3 or 6 seconds.

Usage

When to use

Snackbars provide instant feedback on an action the user has performed, or the system will perform, in a minimally interruptive way. It's a concise, straightforward message, and users should need no guidance to understand it. They shouldn't interrupt the user experience, and don't require user input or interaction for it to disappear. Use it when you just need to present a lightweight feedback, that requires no follow-up actions from the user.

When not to use

Don't use for error messages

Snackbars are not suitable for error scenarios, as their placement is usually far from the source area of the error. They can't sufficiently provide details or action buttons to help users recover.
⁠

Don't use when users need more guidance

Sometimes users need detailed explanations to understand what's happening. In that case, systems alerts or page level messages will be more suitable.
⁠

Don't use when users need to refer to the content

If the content presented is important and users may need to refer to it (e.g. copy or re-read), you should consider alternative ways to show the information.

Component comparison table

Component	How it's triggered	Usage	Attention and interaction	Can it be used for error messaging?
Dialog	User	Use sparingly as it's purposefully interruptive and launches a pop-up over the page. Requires user interaction to dismiss.	Immediate user attention and interaction	Yes
System alert	System	Provides a system-wide update and stays visible until it's dismissed.	No immediate attention or interaction required	No, unless exceptions are given
Page-level message	System or user	Presents important contextual information for users to take action. Commonly paired with form fields. Don't auto dismiss.	Medium to high level of user attention and interaction	Yes
Snackbar	User	Provides light feedback without requiring user interaction.	Low attention and no interaction required	No