Our primary typefaces are one of the main ways that we communicate who we are – exceptional at what we do, but accessible to everyone. Carefully curated fonts combine geometric shapes with soft accents to indicate a sense of harmony between technology and humans.
Protokoll Regular for large headers – to give more prominence and clarity to your message:
Inter UI Semibold for smaller subheaders – to balance out large headers:
Sabon Italic for keyword highlights – to add a human touch:
Inter UI Regular for body copy – to ensure readability:
Protokoll, Inter UI and Sabon should be used wherever possible. However, when this isn’t possible (such as when creating documents where primary fonts aren’t installed), we recommend using alternative system fonts which have been selected to closely match with our primary typefaces.
IBM Plex Sans Regular for large headers:
Roboto Bold for subheaders:
Crimson Pro Italic for keywords in headers:
Roboto Regular for body copy:
When resizing text across headers and body, we draw inspiration from nature and art to maintain the sense of balance.
The 1.618 golden ratio formula ensures we preserve the right proportions. All you have to do is to multiply / divide your fontsize by 1.618 to get the rough, new size. Eg if your header is 23 pt and you need a fontsize for body copy, simply divide 16 by 1.618 to get 14 pt body copy font size.
To emphasise the technology-human interaction, we encourage you to use Sabon Italic when highlighting keywords in titles.
Bear in mind that the Protokoll / IBM Plex Sans and Sabon / Crimson Pro have different x-heights. Therefore, once you finish conversion, you have to scale Sabon / Crimson Pro up 1.131 /1.257 x the point size of Protokoll / IBM Plex Sans to match the x-heights.
To ensure the body copy looks readable and cohesive but not too jarring, use Inter UI Regular / Roboto Normal #595959 when displayed on white background or #999999 when displayed on black background.
If you want to highlight specific words or phrases, please use Inter UI Semibold / Roboto Bold #000000 when displayed on white background or #FFFFFF when displayed on black background.
Resize highlighted words in Sabon / Crimson Italic to match the x-heights:
Maintain a significant font size between headers and body copy:
Use assigned typefaces for headers and body copy:
Display numbered lists in Sabon / Crimson:
Bold key words and phrases in body copy:
Ensure a high contrast between the text and the background:
When highligting keywords in Sabon / Crimson Italic, never highlight more than 40% of the header:
Don’t make documents hard to read by placing dark text on a dark background (or light text on a light background):
Don’t use Sabon / Crimson Italic for sentences, paragraphs:
Don’t use other fonts than Faculty brand or system typefaces:
Don’t hyphenate words over two lines:
Don’t stretch the letter forms:
Don’t use drop-shadows in text:
Don’t underscore:
Don’t use random font sizes:
Don’t use all capital letters (except in some digital applications):
Don’t bold main headers:
Don’t justify text:
