UI component libraryToast and Notification UI Components
Status and activity components

Toast and notification components for product feedback

Explore temporary and persistent feedback patterns for completed actions, errors, account events, downloads, and product activity.

Form feedbackDownload statusCheckout eventsAccount activitySystem alertsBackground tasks

Choose feedback based on urgency and persistence

Use a toast for brief confirmation that does not require immediate action. Persistent errors, security issues, or information users need to revisit belong in an alert, inline message, notification center, or dedicated status surface.

Messages should state what happened and what the user can do next. Keep placement consistent, announce important updates accessibly, and avoid stacking so many temporary notices that actions become difficult to follow.

Component FAQ

Questions about toast and notification ui components

Practical answers about framework fit, responsive behavior, accessibility, source access, and implementation.

When should I use a toast?

Use a toast for brief confirmation or low-risk status that users do not need to revisit, such as a saved preference or copied value.

How long should a toast remain visible?

Keep simple confirmations visible long enough to read. Errors or notices with actions should persist or be placed inline instead of disappearing automatically.

Where should notifications appear on mobile?

Use a safe viewport area that does not cover bottom navigation, keyboards, checkout controls, or other critical actions.