Inline Alert

An inline alert is a message displayed within the context of the page content to inform the user of important information, warnings, or errors.

Base Components

Overview

An inline alert is a message displayed within the page content to inform the user of important information.
https://www.figma.com/embed?embed_host=share&url=https%3A%2F%2Fwww.figma.com%2Fdesign%2FGl3138LYJ71TKOZEC0F8nJ%2FShipfaster-UI---v2.7.1-(LIVE)%3Fnode-id%3D124-40956%26t%3DpA8X0YmO6d7F2SMU-1

When should you use them?

Use inline alerts to provide immediate feedback related to a specific section or action within the interface, such as form validation errors or success messages.

How should you use them?

  • Use clear and concise language to convey the message.
  • Use distinct colors and icons to differentiate between types of alerts (e.g., success, error, warning, info).
  • Position the alert close to the relevant content or action.
  • Ensure alerts are accessible, with proper ARIA roles and attributes.
  • Provide a way for users to dismiss the alert if it is not critical.
Previous

No previous post
Up next

No next post