You can use the horizontal rule component, also known as Hr, to create a break between sections of content.

{{ aspExample({ code: "", nunjucks: "", json: "", title: "", example: "default", id: "6780d704aa08e" }) }}

When to use this component

Use horizontal rule to visually separate sections of content.

When not to use this component

This component should be used sparingly. It’s better to keep sections distinct with proper HTML hierarchy where possible.

Examples of where we have used this component

This component is used on: 

This list is not exhaustive.

Status of development

The below criteria all need to be met for a component to be considered as fully developed for use within the ASP Digital Design System.

Development criteria Status
WCAG 2.2 compliant Not started
WCAG 2.1 compliant Completed
HTML / Nunjucks version Completed
Figma version Not started
M365 versions Not started
Documentation In progress

Make a change to the Design System

Suggest an edit to this system, or any of the components in it, by submitting a Design System change request.