When to use
Use for status the user should not miss while staying on the page.
Loading…
Find components, patterns, tokens, and docs
Component
Inline message that explains a page-level or section-level status.
Preview
<Alert
variant="success"
size="medium"
>
Your billing address was updated.
</Alert>Appearance is not enough. This is the contract for when the control earns a place in the product.
Use for status the user should not miss while staying on the page.
Use toast for transient confirmation. Use modal only when work must stop.
Surfaces important status without hijacking the entire viewport.
role=alert or status depending on urgency. Don't rely on color alone.