USER INTERFACE ELEMENTS

Notifications

Notifications

Overview

Browser- or app-level notifications span the full width of the viewport and provide the user a variety of alerts — from system issues to process statuses. They can also be used to request the user accept terms such as browser cookies.

Use notifications when it’s critical to capture the user’s attention. A variety of message styles are available to use for different contexts.

Alert

This is a higher priority type of notification. It is meant to signal urgent or critical information to the user, such as errors, warnings, or important updates requiring immediate action.

Alert

Resources

Cookie

A discreet banner that informs users about the use of cookies on the website or application, explaining the purpose of cookies and providing options for users to manager their cookie preferences or learn more about the websites privacy policies.

met-life-des-foundations-standards-user-interface-elements-asset-01

Resources

Info

A blue banner that provides informative messages or helpful tips to users, such as notifications about new features, guidelines, or general information to enhance user experience.

Info

Resources

Promo

A purple banner that highlights promotional offers, discounts, or announcements about upcoming events or product launches, encouraging users to take advantage of special opportunies.

Promo

Resources

Success

A green banner that indicates a succesful message, such as confirming a submission or registration. It helps provide positive feedback and reassurance o the users.

Promo

Resources