Banner

Banners notify users when something important happens in the current case or flow, or when a user action is requested. Banners present three types of content: warnings, information, and critical issues.

The banner component should be displayed at the top of the region the banner is addressing.

Urgent banners show messages that the user must instantly be aware of in order to move forward or to prevent data loss. Examples include server errors, reboot timers, or a summary of form errors. These banners should never be dismissible.

Warning banners show non-blocking issues that may have serious consequences if ignored. They are often non-dismissible. Examples include legal considerations and reminders about expirations.

Information banners show useful things such as tips, help, or context. They are often dismiss-able and do not use the multi-line pattern often.

• Labels on calls-to-action should be written as actions or commands. Examples include: "View item," "Edit record," or "Configure section."
• Content within banners should end in a period.
• There should be only one call-to-action per banner.
• Banners may either be a single line of text or stack messages when two or message of the same type appear. Examples include when a few uploads fail, or when more than one form field has an error.
• Use banners sparingly to emphasize importance of each message.
• Avoid having various types of banners in a single region.

All information on this site pertains to the Constellation UX System (from 8.8 and onwards). Looking for something else? See resources specifically for Theme Cosmos. If you have questions, concerns, or any other feedback, please reach to us on Pega Support and include the capability 'User Experience' and 'Constellation' in your request.

• App announcement

• Modal dialog