Callout

Usage

Callouts are text excerpts, used as a visual cue to draw attention to content.

Use callouts to:

• call attention to important pieces of information
• supplement a point in the main text
• supply information that applies in special cases
• link to a relevant resource

When to avoid

Callouts should be used sparingly to maintain effectiveness, consider weaving the information into the introduction or as part of the instructions you're creating.

Do not:

• add multiple callout boxes to a topic. This dilutes the importance of the callout and distracts the user.
• create a callout with content that is not relevant to the user as your reader might then ignore future callouts.

How this component works

Callouts can contain an icon, a title and a message. Callouts should be short, easy to scan, informative and clear.

Accessibility

All components are responsive and meet WCAG 2.1 AA accessibility guidelines.