Warning text

Use the warning text component when you need to warn users about something important.

Open this example in Storybook

When to use this component

Use the warning text component when you need to warn users about something important, such as legal consequences of an action, or lack of action, that they might take.

How it works

There are 2 ways to use the warning text component. You can use HTML or, if you are using Nunjucks, you can use the Nunjucks macro.

Open this example in Storybook

Get the Nunjucks macro for this example from the Camden Frontend library

You might need to rewrite the hidden text (‘Warning’ in the example) to make it appropriate for your context.

Research on this component

This component is based on the warning text component from the GOV.UK Design System.

You can take part in the ‘Warning text' discussion on GOV.UK’s Design System’s GitHub and share your research.