Skip to content

Promotional Banner

Displays an important, succinct, promotional message, and provides actions for users to address (or dismiss the banner). It requires a user action to be dismissed.

Meet Subscriptions

Take control over your recurring payments. No more duplicates, no more wondering who pays for what.

  • Show an illustration, a message and an action.
  • Choose the variant that matches the importance of your message.
  • Responsive out of the box.

Banners should be displayed at the top of the screen. They’re persistent and nonmodal, allowing the user to either ignore them or interact with them at any time. Only one banner should be shown at a time.

This is the primary default variant.

Meet Subscriptions

Take control over your recurring payments. No more duplicates, no more wondering who pays for what.

Meet Subscriptions

Take control over your recurring payments. No more duplicates, no more wondering who pays for what.

Meet Subscriptions

Take control over your recurring payments. No more duplicates, no more wondering who pays for what.

Meet Subscriptions

Take control over your recurring payments. No more duplicates, no more wondering who pays for what.

Meet Subscriptions

Take control over your recurring payments. No more duplicates, no more wondering who pays for what.

Meet Subscriptions

Take control over your recurring payments. No more duplicates, no more wondering who pays for what.

Meet Subscriptions

Take control over your recurring payments. No more duplicates, no more wondering who pays for what.

  • Action banner: A versatile and somewhat unopinionated component. Commonly used as a linkbox to combine multiple elements into a single interactable element.
  • Banner: A prominent section at the top of a page that provides users with important feedback or information relating to the entire page, product, or application.
  • Callout: Capture the attention of users and provide them with important feedback or information that relates to an entire page or page section.