Callouts
Highlight important information with callouts to make your content stand out.
Note Callout
This adds a note to your page
note.mdx
<Note>This adds a note to your page</Note>Info Callout
Bring attention to important information
info.mdx
<Info>Bring attention to important information</Info>Tip Callout
Suggest helpful tips
tip.mdx
<Tip>Suggest helpful tips</Tip>Warning Callout
Raise a warning to watch out for
warning.mdx
<Warning>Raise a warning to watch out for</Warning>Error Callout
Indicate a potential error or danger
error.mdx
<Error>Indicate a potential error or danger</Error>Custom Callout
Want a customized callout? Just use the customizable <Callout/> component.
Custom callout in Royal Purple
callout.mdx
<Callout icon="Bird" color="#A020F0">
Custom callout in Royal Purple
</Callout>Props
color
stringHEX color code for your custom callout.
icon
stringThe Lucide component icon name of your callout. Browse Lucide for available icon names