Banner

A Banner is a notification displayed in-context to convey an important message to users.

Component Status

React documented

Flutter documented

Design

Is the design finished and component available in Figma library?

Up to date

React

Is new design vision part implemented using new tokens?

Up to date

Flutter

Is new design vision part implemented using new tokens?

Up to date

Introduction

Banners are components that provide information that is important for the user in completing his task or feedback about an operation or task. They persist until the trigger for the message is resolved or, when enabled, dismissed by user.
They support several semantic variants to provide context to the message. They are designed to capture users’ attention but not interrupt their flow at the same time.

Overview