Editorial text styles

Use the editorial text styles to draw attention to aspects of your content. The styles below map to the current HTML text styling tags. Where possible we recommend using HTML semantic elements as they clearly describe the meaning of the content to the browser and the developer. This will also maximise the opportunity to provide accessible content.

Headings

Heading styles are not managed by the Design System, however @color-Headings variables are maintained for each brand and are mapped through; setting the appropriate heading colour for all heading elements (h1 — h6).

User experience

Text styling can influence decision making, bring attention to something, assist users to navigate a page when scanning, and build trust. This is achieved through an understanding of typographic fundamentals such as type scale and hierarchy, positioning and signposting, when to use which font or typeface, and any digital nuances.

Visual design