Cards example

Custom heading levels

Override default heading level by passing through heading_level parameter (defaults to <h2>).

Override default subheading level by passing through sub_heading_level parameter (defaults to <h3>)

How it looks (preview)

Services and information

  • Benefits

    Includes eligibility, appeals, tax credits and Universal Credit

How to call this example

<%= render "govuk_publishing_components/components/cards", {
  heading: "Services and information",
  heading_level: 3,
  sub_heading_level: 4,
  items: [
    {
      link: {
        text: "Benefits",
        path: "http://www.gov.uk"
      },
      description: "Includes eligibility, appeals, tax credits and Universal Credit"
    }
  ]
} %>