Callout Block

A Callout Block emphasizes an excerpt of text in support of the main body of text.

This is a Callout Block component.

This component allows you to format text in bold and italic.

You can also have lists:

  • such as a bulleted list
  • such as a bulleted list
  • such as a bulleted list

Or you can have a numbered list

  1. Like this
  2. Like this
  3. Like this

You can also display links

When to use this component

Most users scan a page rather than read, so this component provides them with a focus anchor to fix their attention to the most important part of our articles.

Use this component:

  • For longer and larger amounts of text
  • To display informative text

When not to use this component

This component should not be used as a section summary or subheading.

Decide between using Callout Block, Callout Full, Callout Short and Callout Time Location

Callout Block, Callout Full, Callout Short and Callout Time Location all work to draw attention to a certain body of text. Avoid using any of these components together, as they will lose their individual impact on a page.

If you decide to use one of these components, consider if:

  • A short body of text (a paragraph) that emphasizes a point relevant to the body of text it is displayed next to, use the Callout Block component.
  • A medium sized body of text (a couple of paragraphs) (incl. buttons, links, and headings if applicable) that highlights key facts and tips, use the Callout Full component.
  • A snappy sentence with big impact, and can be scanned and read without context of the page, use the Callout Short component.
  • Specific information about an event, training course, campaign details etc, then use the Callout Time Location component.