This is an internal development app.
To learn how to use the GOV.UK Design System in your project, see Get started.

Skip to main content

Panel

Code

Markup

<div class="govuk-panel govuk-panel--confirmation">
  <h1 class="govuk-panel__title">
    Application complete
  </h1>
  <div class="govuk-panel__body">
    Your reference number: HDJ2123F
  </div>
</div>

Macro

{% from "govuk/components/panel/macro.njk" import govukPanel %}

{{ govukPanel({
  titleHtml: "Application complete",
  text: "Your reference number: HDJ2123F"
}) }}
Code

Markup

<div class="govuk-panel govuk-panel--confirmation">
  <h2 class="govuk-panel__title">
    Application complete
  </h2>
  <div class="govuk-panel__body">
    Your reference number: HDJ2123F
  </div>
</div>

Macro

{% from "govuk/components/panel/macro.njk" import govukPanel %}

{{ govukPanel({
  titleText: "Application complete",
  headingLevel: 2,
  text: "Your reference number: HDJ2123F"
}) }}