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:
Inter UI Regular for body copy – to ensure readability:
Sabon Italic for decorative subheaders – to add a human touch:
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:
Roboto Regular for body copy:
Crimson Pro Italic for decorative subheaders:
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.
Use colour in headers sparingly:
Maintain a significant font size between headers and body copy:
Use assigned typefaces for headers and body copy:
Use Sabon / Crimson Italic for decorative subheaders and/or quotes:
Bold key words and phrases in body copy:
Ensure a high contrast between the text and the background:
Display numbered lists in Sabon / Crimson:
Underscore CTAs and links:
Use blue for hyperlinks on a white background:
Use yellow for hyperlinks on black, magenta, blue and midnight blue backgrounds:
Don’t use Sabon / Crimson Italic for headers and keywords:
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 display magenta text on blue background and vice versa:
Don’t use grey text on colour:
Don’t use midnight blue for keywords highlights:
Don’t use random font sizes:
Don’t use all capital letters (except in some digital applications):
Don’t bold main headers or keywords in headers:
Don’t justify text:
Don’t display body paragraphs in magenta, yellow, blue or midnight blue:
Don’t use multiple colours to highlight keywords:
