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


  • Alerts should indicate a title and description.

  • They should be easy to identify.

When to use

  • Use Alerts to represent 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.


  • There are four types of Alerts with varying colors.

  • The updatable properties of Alerts are type, title, and description.

  • The updatable behaviors 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.

Did this answer your question?