Callouts make your content stand out with background colors and borders so your key points easy to spot. They’re great for providing additional context and summarizing key points.
This is a callout.
This is an alert callout.
This is an info callout.
This is a note callout.
This is a tip callout.
To create callouts, add the .callout
class to any paragraph and include the .alert
, .info
, .note
, or .tip
class to add variety to the style.
<div class="callout"> This is a <strong>callout</strong>. </div> <div class="callout alert"> This is an <strong>alert callout</strong>. </div> <div class="callout info"> This is an <strong>info callout</strong>. </div> <div class="callout note"> This is a <strong>note callout</strong>. </div> <div class="callout tip"> This is a <strong>tip callout</strong>. </div>