Callouts
Callouts help break up the page flow by providing colorful boxes with text information to notifiy the user about something important on the page.
Info Callout#
Displays a soft blue box with an info icon, useful for information based information.
This draws attention to useful page information.
<Info>This draws attention to useful page information.</Info>
Warning Callout#
Displays a yellow box with a warning icon, useful for warning the user about something.
This draws attention to a warning they should take notice of.
<Warning>This draws attention to a warning they should take notice of.</Warning>
Error Callout#
Displays a red box with an error icon, useful for loud pieces of information.
This draws attention to an error the user might run into if they don't pay attenion.
<Error>This draws attention to an error the user might run into if they don't pay attenion.</Error>
Success Callout#
Displays a green box with a check icon, useful for showing the user they did something right.
This draws attention to a successful action the user has taken.
<Success>This draws attention to a successful action the user has taken.</Success>