Menu Icon

Alert

An alert gives a notification. They let users know what is expected.

Usage

Clarity comes with four different types of alerts to use. They provide to give visual distinction between alerts.

Guidance

  • Alerts should indicate a title and description.
  • They should be easy to identify.

When to use

  • Use Alerts to represent a feedback of success, warning, information or error.

Additional info

  • Consider using a close text to be closed of Alert.
  • Consider using an icon in dense environments.

Variations

  • There are four types of Alerts with varying colors.
  • The updatable properties of Alerts are type, title and description.
  • The updatable behaviours of Alerts are closable, show icon and banner.
  • The updatable style features of Alerts are margin, padding, size, overflow, background, border and css.
  • The usable dynamic properties of Alerts are type, message, description, banner, closable, showIcon, closeText, icon, hidden and style.