Alert

Inline status messages for forms and page sections.

Variants

Preview Code default · success · warning · info · danger

<ac-alert>Default notification message.</ac-alert>
<ac-alert variant="success">Operation completed successfully.</ac-alert>
<ac-alert variant="warning">Please review your inputs before continuing.</ac-alert>
<ac-alert variant="info">A new version is available for your account.</ac-alert>
<ac-alert variant="danger">An error occurred. Please try again.</ac-alert>

Copy

Attributes

Attribute	Values	Description
variant	success | warning | info | danger	Color and icon scheme

CSS class usage

<div class="ac-alert ac-alert--success">Success message</div>
<div class="ac-alert ac-alert--danger">Error message</div>