Headings

Notes

  • use GDS Transport Website Bold
  • use sentence case for headings
  • use headings consistently to create a clear hierarchy
<!-- Start: @headings--default -->
<h1 class="heading-xlarge">A 48px bold heading</h1>

<h2 class="heading-large">A 36px bold heading</h2>

<h3 class="heading-medium">A 24px bold heading</h3>

<h4 class="heading-small">A 19px bold heading</h4>
<!-- End: @headings--default -->
 
<h1 class="heading-xlarge">A 48px bold heading</h1>

<h2 class="heading-large">A 36px bold heading</h2>

<h3 class="heading-medium">A 24px bold heading</h3>

<h4 class="heading-small">A 19px bold heading</h4>
 
/* No context defined for this component. */