Callouts

A built-in component to show important information to the reader

Callout properties

Customize your Callouts using the title and icon properties.

title
string

The title of your Callout

icon
string | element

The icon of your Callout. Can be a Font Awesome icon name or an HTML element.


Example Callout

This Callout uses a title and a custom icon.

Callout varieties

Note callouts

This adds a note in the content
1<Note>This adds a note in the content</Note>

Warning callouts

This raises a warning to watch out for
1<Warning>This raises a warning to watch out for</Warning>

Error callouts

This indicates a potential error
1<Error>This indicates a potential error</Error>

Info callouts

This draws attention to important information
1<Info>This draws attention to important information</Info>

Tip callouts

This suggests a helpful tip
1<Tip>This suggests a helpful tip</Tip>

Check callouts

This brings us a checked status
1<Check>This brings us a checked status</Check>