Callout

---

The Callout component is designed to highlight important information, warnings, errors, or successes in your application. It is a versatile alert box with customizable variants and titles.

Props

• variant

  Type: string

  Default: “info”

  Options: "info" | "warning" | "danger" | "success"

  Description: Defines the type of alert to display. The variant determines the color, icon, and default title of the alert.

• title

  Type: string

  Default: Default titles based on the variant

  Description: Custom title for the alert. If not provided, the default title for the specified variant will be used.

• icon

  Type: LucideIcon (optional)

  Default: Default icon based on the variant

  Description: A custom icon to use in the alert. If not provided, the default icon for the specified variant will be used. You can look for icons at lucide.dev.

Basic Usage

To use the Callout component, import it and use it in your Astro files with the desired variant and title.