Section break
You can use the govuk-section-break classes on an <hr> element to create a thematic break between sections of content. govuk-section-break has class-based modifiers for different size margins.
By default govuk-section-break is only visible by its margin. You can add the govuk-section-break--visible class to make it visible with a separator line.
<hr class="govuk-section-break govuk-section-break--xl govuk-section-break--visible">
<hr class="govuk-section-break govuk-section-break--l govuk-section-break--visible">
<hr class="govuk-section-break govuk-section-break--m govuk-section-break--visible">
<hr class="govuk-section-break govuk-section-break--visible">Help improve this style
To help make sure that this page is useful, relevant and up to date, you can:
- take part in the ‘Section break’ discussion on GitHub and share your research
- propose a change on GitHub – read more about how to propose changes in GitHub
Need help?
If you’ve got a question about the GOV.UK Design System, contact the team.