Skip to content

PatternsContent patternsCallout

Callout

A small, in-prose note. Used to add context, ask a question, or flag a warning.

4 tonesInline placementCompact

When to use a callout

A callout is the right choice when you want the reader to pause. It is not a heading. It is not a paragraph. It is a small aside that earns its place by being shorter than the section it's inside.

Tones

Info is the default. Accent is editorial (designer-to-designer). Warning and success are reserved for cases that change the reader's next action.

Info

A general note about the section above.

Accent

A designer-to-designer aside. Use sparingly.

Warning

A non-fatal issue. Read before continuing.

Rules of thumb

  • One callout per section, maximum. Two callouts in the same section means the section has two asides.
  • Callouts are not headings. They sit below the H2, not in place of it.
  • Callouts never include a figure or a diagram. They are short.