Component
Panel
Used on confirmation or results pages to highlight important content.
How it looks (preview all)
Application complete
Your reference number
HDJ2123F
HDJ2123F
How to call this component
<%= render "govuk_publishing_components/components/panel", {
title: "Application complete",
description: sanitize("Your reference number<br>
<strong>HDJ2123F</strong>
")
} %>
GOV.UK Design System
This component incorporates components from the GOV.UK Design System:
Accessibility acceptance criteria
- have a text colour contrast ratio of more than 4.5:1 with its background to be visually distinct
Other examples
No description (preview)
Content has been published
<%= render "govuk_publishing_components/components/panel", {
title: "Content has been published"
} %>
With prepend (preview)
The clocks go forward
31 March
<%= render "govuk_publishing_components/components/panel", {
prepend: "The clocks go forward",
title: "31 March"
} %>
With prepend and append (preview)
The next bank holiday in England and Wales is
19 April
Good Friday
<%= render "govuk_publishing_components/components/panel", {
prepend: "The next bank holiday in England and Wales is",
title: "19 April",
append: "Good Friday"
} %>