Alert components
Alert components are designed to communicate timely messages, notifications, or system statuses to users in a clear and consistent way. They help guide user behavior, provide important information, and signal warnings, errors, or successes. Flexible, visually distinct, and adaptable to various contexts, alert components ensure users notice and understand critical messages without interrupting their overall experience.
Alert components range from informational, warning, error, success, to utility, depending on the type of message being conveyed. They also serve as the base pattern for messaging across our products. Success, error, informational, and warning messages in forms and other components use the same colors and styling principles, ensuring a consistent experience even when positioned differently or embedded in other elements.
Alert components include:
- A1 Alert - Full-width alert bar positioned at the top of the page above all other content. Ideal for high-priority messages or notifications that need immediate user attention.
- A2 Pinned Alert Card - Card-style alert that can be pinned to the bottom of the browser window, similar to a popup. Ideal for contextual messages that persist without obstructing the main page content.
Alert components index