Message Bar

MessageBar shows persistent status at the top of a page or section — session warnings, connectivity loss, or validation summaries that should stay visible until resolved.

Pick MessageBarIntent for severity, switch to MessageBarLayout::Multiline when you need a title, body, and action row. For fleeting confirmations, use Toast instead.

  • Page-level or section-level status that must remain visible until the user acts
  • Warnings with optional retry or dismiss actions in MessageBarActions

Prefer Toast for short-lived saves or errors that should not block the UI. Prefer Field validation for errors tied to a single form control.

  • Set intent to match severity (Info, Success, Warning, Error).
  • Put primary copy in MessageBarBody; add MessageBarTitle when the message needs a headline.
  • Use layout=MessageBarLayout::Multiline when stacking title, body, and MessageBarActions.
  • Place retry or dismiss Button children in MessageBarActions — there is no built-in close icon.
Intent matrix

Show all four severity presets side by side so teams can pick the right tone for status, success, warning, and error states.

Your session expires in 10 minutes.
Your profile was updated successfully.
Check your network connection.
Upload failed. Try again.
With title

Pair a bold title with supporting body copy — one example per intent on the default single-line layout.

Session ending
Your session expires in 10 minutes.
Saved
Your profile was updated successfully.
Connection lost
Check your network and try again.
Upload failed
The file exceeds the 10 MB limit.
Multiline

Multiline layout stacks title and body when the message needs more room or a footer action row below.

Session ending
Your session expires in 10 minutes. Save any unsaved work before you are signed out.
Saved
Your profile was updated successfully. Changes may take a moment to appear elsewhere.
Connection lost
Check your network and try again. Some features may be unavailable until you reconnect.
Upload failed
The file exceeds the 10 MB limit. Choose a smaller file and try again.
With actions

Place retry or dismiss actions in the footer so users can respond without leaving the banner context.

Connection lost
Check your network and try again.
Theme token

Message bar borders and backgrounds inherit intent tokens from the Orbital theme provider.

Themed message bar surface