Alerts highlight important information the user needs to see, like errors. They provide medium-priority messaging throughout the product and remain on screen until dismissed, an action is selected, or the app deems it suitable to remove it (for example, moving from one page to another).
You can also use alerts to communicate other types of messaging, like warnings, success messages, or informational messages. We use colors and icons to communicate the difference:
- Use the blue info alert when notifying the user of neutral information.
- Use the green success alert when notifying the user that a successful action has taken place.
- Use the gold warning alert when notifying the user that an error has occurred, though they may proceed without rectifying anything.
- Use the red error alert when notifying the user that an error has taken place that requires their attention before they can proceed, or if the user's action will result in deletion of data.