Component
Heading
Headings structure the page. Three sizes are available, plus an optional eyebrow, alignment, HTML level and coloured words.
Variant
Page title
The big title at the top – once per page, as h1.
Template: PageTitle
Eyebrow
Freshly roasted
Variant
Standard heading
For each new section, as h2.
Template: SectionTitle
Eyebrow
Freshly roasted
Variant
Small heading
For cards, tiles and sub-points.
Template: SmallTitle
Eyebrow
Freshly roasted
Option
Eyebrow detached or attached
Left as its own coloured line above the title; right as part of the heading.
Eyebrow
Freshly roasted
EyebrowFreshly roasted
Option
Alignment
Left, centred or right.
Left
Centred
Right
Option
Colour and icon in the title
Single words can be highlighted in a scheme colour, and icons sit right in the text.
Coffee roasted fresh
Option
Hyphenation
Long words are hyphenated in narrow columns instead of overflowing.