A callout is a way of making text stand out as important. We only use them in specific circumstances on the Acas website.
When to use this pattern
Use this pattern whenever you are using a callout.
Only use a callout if it's:
- important – for example, there's a risk for the user if they do not do something
- the only way to make important information more prominent on the page
It's usually best to put important information at the top of the page, rather than in a callout. If that's not possible, it might be appropriate to use a callout. For example, in the third step of a chronological process, telling users to make sure they've done something first.
The pattern
Example
Things to remember
Use the 'inset text' styling in the CMS to put text in a callout.
Callouts should only be 1 to 2 sentences long.
Always include 'Important:' at the start of a callout to make the meaning clear for people using screen readers.