Flash alert informs users of successful or pending actions.
On this page
On this page
Flash alerts are used to display updates or alerts pertaining to any part of the system; this includes information regarding the user's account, the organization, the repo, and more.
These updates are typically not user-initiated but rather alerts that require the user's attention. Similarly to toasts, flash alerts can convey a warning, error, success, or a neutral message. If additional context is needed, provide a link for the user to learn more.
Use flash alerts sparingly and only when necessary. Flash alerts can disrupt the user experience and should only be used when and where relevant.
Though flash alerts don't need to be as concise as a typical Toast message, they should be direct and not exceed two to three sentences. Don't use headings or multiple type sizes in flash alerts, rely on the default paragraph size instead.
Don't show more than one flash alert at a time. For more information, see this article on alert fatigue.
They do not typically timeout on their own, but can include a dismiss action for messages that can be closed.
There are four types of flash banners, each with their own styles: Default, Warning, Danger, and Success.
Full-width can be applied when attaching a banner to a container. It attaches only to the top of a container.
Accessories and actions
Banners contain options to add an icon, button, or dismiss button to the content of the alert.
The flash component should trigger notifications for users utilizing assistive technology. They should be considered as part of the overall messaging in the product and do not recieve focus (therefore, they do not require a dismiss button).