Info
System update
Maintenance window starts at 02:00 UTC.
<Alert variant="info">
<AlertTitle>System update</AlertTitle>
<AlertDescription>Maintenance window starts at 02:00 UTC.</AlertDescription>
</Alert>Success
Deploy finished
All 12 services healthy in production.
<Alert variant="success">...</Alert>Warning
Rate limit near
80% of monthly quota consumed.
<Alert variant="warning">...</Alert>Danger
Incident detected
Payment gateway returning 503.
<Alert variant="danger">...</Alert>Accessibility
How Alert works with assistive tech
- Role
- alert (danger/warning), status (info/success)
- Keyboard
- not interactive (unless dismissible variant added)
- ARIA attributes
- aria-live=assertive for danger; aria-live=polite for other severities
- Focus behavior
- not-focusable
Severity conveyed via border-left color AND accessible role — not color alone. Icon is decorative (aria-hidden).