Your bookmarks

Toast

Also known as snackbar

Shows a brief, informative message that will appear only for a short time.

Some messages don’t have permanent effect, such as feedback on a user action or warnings about specific states. Let users know that their request is being processed or has been completed using a toast message that will disappear on its own.

Toasts are temporary notifications, so they are best for short and clear messages generally 1 or 2 sentences long. If more information is necessary, use a text link to link to a more detailed description (don’t truncate the toast itself). If your message requires action from the user, use a standard alert that will stay on the screen.

Component status

Figma
Designing
ETA: March
Web (React)
Planned
iOS (Swift)
n/a
Android (Kotlin)
n/a
Sketch
n/a

Positioning

This component can be in different positions that are commonly used on websites, such as one of the corners of the screen. For mobile devices, the component is located at the bottom of the screen and is stretched to cover the entire device width.