deprecated
Forma 36 version 3 is not supported anymoreClick here to go to version 4
Forma 36

Notification

StorybookGithub
stable

Notifications give immediate feedback about an action triggered or experienced by an user. They will dismiss after 6 seconds, or after being clicked.

Table of contents

How to use Notifiaction

  • Consider where the notification will be placed and which variation is most appropriate
  • Don't confuse notifications with notes, which persist in the UI and do not dismiss
  • The notifications will close themselves when the close button is clicked, or after a timeout — the default is 6 seconds.
  • In some situations toasts might become outdated before they expire. In those situations you can use Notification.closeAll() to close all open toasts.
  • When the use hovers (mouse overs) the toast it will stop the countdown timer and the toast will stay alive as long as the toast is being hovered.

Code examples

Basic example

The Notification component can be configured in a number of different ways. Here is a guide to when to use certain variations.

Intent

Position

API

Content recommendations

  • Use clear and succinct copy, since the notification will only be available for 6 seconds
  • Use active voice, present tense, and consider tone of voice depending on the circumstance
  • Use sentence style caps (in which only the first word of a sentence or term is capitalized)

Accessibility

Missing