Typography | Digital.NSW

On this page

Typeface
Type hierarchy

Typeface

Montserrat is the only font to be used by agencies for NSW Government websites and online applications. Major headings through to body copy must also use Montserrat.

Montserrat is a FREE font and available from Google Fonts.

System fonts

System fonts are rendered locally by your web browser, this provides greater speed when loading your content. The preferred system font is Arial.

As a good rule of thumb, you should still refer to a system font as a fallback in your CSS font stack:

body {font-family: Montserrat, Arial, sans-serif; }

Type hierarchy

The NSW Design System has the following size tokens:

Token	Small screens (< 992px)	Large screens (≥ 992px)
xxxl	36px	48px
xxl	28px	32px
lg	22px	24px
md	18px	20px
sm	16px	16px
xs	14px	14px

Headings are used to create a clear visual hierarchy, to facilitate finding information on the page. There are different standard sizes for the headings for large screens and smaller screens.

The Design System provides 2 body copy styles, one standard with 1.5REM line spacing and one condensed with 1.25REM line spacing. The default line spacing is used for larger bodies of copy, for easier readability. The condensed line spacing is used for smaller content bodies optimised for scanning.

Large screens ≥ 992px

H1

font-family: Montserrat, Arial, sans-serif;
font-size: 48px;
font-weight: 600;
line-height: 60px;
token: xxxl

H2

font-family: Montserrat, Arial, sans-serif;
font-size: 32px;
font-weight: 600;
line-height: 40px;
token: xxl

H3

font-family: Montserrat, Arial, sans-serif;
font-size: 24px;
font-weight: 600;
line-height: 32px;
token: lg

H4

font-family: Montserrat, Arial, sans-serif;
font-size: 20px;
font-weight: 600;
line-height: 28px;
token: md

H5 & H6

font-family: Montserrat, Arial, sans-serif;
font-size: 16px;
font-weight: 600;
line-height: 24px;
token: sm

Intro text

font-family: Montserrat, Arial, sans-serif;
font-size: 20px;
font-weight: 400;
line-height: 28px;
token: md

Body

font-family: Montserrat, Arial, sans-serif;
font-size: 16px;
font-weight: 400;
line-height: 24px;
token: sm

Small text

font-family: Montserrat, Arial, sans-serif;
font-size: 14px;
font-weight: 400;
line-height: 19px;
token: xs

Small screens < 992px

H1

font-family: Montserrat, Arial, sans-serif;
font-size: 36px;
font-weight: 600;
line-height: 45px;
token: xxxl

H2

font-family: Montserrat, Arial, sans-serif;
font-size: 28px;
font-weight: 600;
line-height: 35px;
token: xxl

H3

font-family: Montserrat, Arial, sans-serif;
font-size: 22px;
font-weight: 600;
line-height: 27.5px;
token: lg

H4

font-family: Montserrat, Arial, sans-serif;
font-size: 18px;
font-weight: 600;
line-height: 24px;
token: md