Page title example

With margin bottom

The component accepts a number for margin bottom from 0 to 9 (0px to 60px) using the GOV.UK Frontend spacing scale. It defaults to having a margin bottom of 50px.

This margin is responsive at certain sizes, see the link above for more detail. Note also that the component has a (responsive) top margin set as well, which cannot be modified.

How it looks (preview)

Margin bottom of 10px

How to call this example

<%= render "govuk_publishing_components/components/title", {
  title: "Margin bottom of 10px",
  margin_bottom: 2
} %>