## Reference

GitHub Markdown Callouts

Published March 2026

GitHub added callout (alert) syntax to GitHub Flavored Markdown. These styled boxes highlight important information in documentation — notes, tips, warnings, and more. ShowMeMyMD is one of the few desktop viewers that renders them.


## The Syntax

Five callout types

Callouts use blockquote syntax with a special tag on the first line. The format is always the same: > [!TYPE] followed by your content on the next line, also prefixed with >.

> [!NOTE]
> Useful information that users should know,
> even when skimming content.

NOTE — Renders as a blue info box. Use it for additional context that's helpful but not critical. Think 'by the way' information.

> [!TIP]
> Helpful advice for doing things better
> or more easily.

TIP — Renders as a green suggestion box. Use it for best practices, shortcuts, or recommendations that make the reader's life easier.

> [!IMPORTANT]
> Key information users need to know to
> achieve their goal.

IMPORTANT — Renders as a purple emphasis box. Use it for information that's critical to understand before proceeding. Not a warning, but something you can't skip.

> [!WARNING]
> Urgent info that needs immediate user
> attention to avoid problems.

WARNING — Renders as a yellow alert box. Use it for potential issues, gotchas, or things that could go wrong if the reader isn't careful.

> [!CAUTION]
> Advises about risks or negative outcomes
> of certain actions.

CAUTION — Renders as a red danger box. Reserve this for irreversible operations, data loss scenarios, or actions that could break things.


## Usage Tips

Writing effective callouts

Use them sparingly

Too many callouts create visual noise. If everything is important, nothing is. A page full of colored boxes trains readers to ignore them. One or two per section is usually the right amount.

Match the type to the severity

Don't use CAUTION for a minor tip. Don't use NOTE for something that could delete a database. The color coding exists to give readers an instant signal about severity — respect it.

Keep content concise

Callouts work best with one to three sentences. If you need multiple paragraphs, the information probably belongs in the main body text, not in a callout box.

You can nest other elements

Code spans, links, bold, and italic all work inside callouts. Prefix every line with > to keep the content inside the callout block.


## Compatibility

Where callouts render

ToolCallout Support
GitHub (web)Full — colored boxes with icons
ShowMeMyMDFull — styled callouts on desktop
Some VS Code extensionsVaries by extension
Most other markdown viewersNo — shows a plain blockquote
Standard CommonMark renderersNo — plain blockquote
Older GFM parsersNo — plain blockquote

Most markdown viewers just show a blockquote.

ShowMeMyMD renders the full styled callout — colored sidebar, icon, and proper formatting — just like it appears on GitHub. If you write READMEs or documentation with callouts, this is one of the few ways to preview them locally on Mac.


## Keep Reading

Learn more about ShowMeMyMD as a Markdown viewer for Mac. See why developers choose it as their developer markdown viewer. Or bookmark our Markdown cheat sheet.


Preview callouts locally

Stop pushing to GitHub just to check how your callouts look. ShowMeMyMD renders NOTE, TIP, IMPORTANT, WARNING, and CAUTION — right on your Mac. $2.99 on the Mac App Store.

Download on theMac App Store