Callout
Display contextual alerts, notifications, and informational messages
Callout
A component for displaying contextual alerts, tips, warnings, and important information in your documentation.
Usage
Use the ::callout MDC syntax to create callouts:
::callout
This is a default callout message.
::
This is a default callout message.
With Icon
Add an info icon by setting the icon attribute:
::callout{icon}
This callout includes an info icon.
::
This callout includes an info icon.
With Title
Add a title using the title attribute:
::callout{title="Note"}
This callout has a title.
::
Note
This callout has a title.
Variants
Default
::callout{icon title="Info"}
This is the default informational callout.
::
Info
This is the default informational callout.
Destructive
Use the destructive variant for warnings and errors:
::callout{icon title="Warning" variant="destructive"}
This action cannot be undone. Please proceed with caution.
::
Warning
This action cannot be undone. Please proceed with caution.