Typography

McMaster’s primary corporate font is Poppins. Headers and buttons should use Poppins. Arial, McMaster’s secondary font, should be used for all body copy displayed on McMaster websites and web applications.

Follow these font styles for headlines and subheads when designing a web page.

H1

Used on hero banners and page introductions. SemiBold font is preferred for page introductions on hero banners.

Font: Poppins 50/55
Default colour: #000000 (#FFFFFF in dark mode)

H2

Used on section titles for callouts and subheads.
Font: Poppins Bold 28/34
Colour: #000000 (#FFFFFF in dark mode)

H3

Used on section titles cards.
Font: Poppins Bold 24/28
Colour: #000000 (#FFFFFF in dark mode)

H4

Used for form titles.
Font: Poppins Bold 20/24
Colour: #000000 (#FFFFFF in dark mode)

H5

Used for table column headers.
SemiBold is preferred for column titles, while Regular is used for column headers.

Font: Poppins SemiBold OR Regular 16/20
Colour: #000000 (#FFFFFF in dark mode)

Body copy

Font: Arial Regular 16/20

Colour: #495965 (#FFFFFF in dark mode)
Link: #7A003C (#FDBF57 in dark mode)

Introduction

Font: Arial Regular 18/26

Colour: #495965 (#FFFFFF in dark mode)
Link: #7A003C (#FDBF57 in dark mode)

Boiler copy

Font: Poppins Regular 12/18