Plandalf

Callouts

Use Mintlify-style callouts and semantic aliases for notes, tips, checks, warnings, danger states, and custom emphasis.

Callouts draw attention to information that changes how a reader should proceed. Keep them short, specific, and tied to the surrounding step.

Callouts are not navigation

If the block sends the reader somewhere else, use a card or tile. If the block changes how they should interpret the current section, use a callout.

Variants

Typed aliases can be used with only children, which matches Mintlify’s default callout authoring style.

This adds a note in the content
This raises a warning to watch out for
This draws attention to important information
This suggests a helpful tip
This brings us a checked status
This is a danger callout 
<Note>This adds a note in the content</Note>

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

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

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

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

<Danger>This is a danger callout</Danger>

Use title when the callout needs a named heading.

Note

Use Note for neutral supporting context.

Tip

Use Tip for a better implementation path or shortcut.

Info

Use Info for neutral context that affects the current implementation.

Warning

Use Warning when a reader can break the install, leak a secret, or publish an incomplete setup.

Check

Use Check for a completed prerequisite or positive confirmation.

Danger

Use Danger only for destructive, irreversible, or security-sensitive paths.

<Warning title="Keep API keys server-side">
  Do not put private Plandalf API keys in browser JavaScript.
</Warning>

<Tip title="Start with one offer">
  Connect one test offer before adding upsells, bumps, or automation.
</Tip>

Custom callouts

Use Callout directly when imported MDX already uses a generic component or when a page needs explicit control over tone and icon.

This is a custom callout 
<Callout icon="key" color="#FFC107" iconType="regular">This is a custom callout</Callout>

Safe to continue

Your first checkout button should open a test offer before production payment settings are connected.

Stop before launch

Do not publish a page that embeds a private token, internal test URL, or unsupported route.

<Callout type="check" title="Safe to continue" icon="check-circle">
  Your first checkout button should open a test offer.
</Callout>

<Callout type="danger" title="Stop before launch" icon="warning">
  Do not publish a page that embeds a private token.
</Callout>

Custom callout properties

The generic Callout component supports custom icons and colors. The typed callouts (Note, Warning, Info, Tip, Check, Danger) use preset icons and colors and can be authored with only children.

iconstring

The icon to display. Use a shared docs icon name, a supported icon-library name, a URL, or an imported SVG value.

iconTypestring

Icon style for icon libraries that support style variants.

Options: regular, solid, light, thin, sharp-solid, duotone, brands.

colorstring

Custom color as a hex code, such as #FFC107. Sets the border, background tint, icon color, and text color of a generic callout.

Plandalf extensions

typeinfo | note | tip | warning | check | danger

Use on Callout when you do not use a semantic alias.

titlestring

Short heading for the callout. Typed aliases hide generated labels by default unless you pass title.

labelbooleandefault: true

Controls whether a generic Callout type="..." without a title shows its generated type label.

Authoring rules

  • Use no more than one callout in a short section.
  • Keep warning and danger callouts visible; do not hide them in accordions.
  • Avoid using callouts as decorative spacing.
  • Prefer direct verbs in titles: Store the token on your server, not Important note.
Banner Use for page-level announcements.
Badge Use for inline status.
Attention guide See the full attention family.

Feature detail