Typography
As of Jan 30, 2023, our primary typeface for all materials is Poppins, available for free embed and download at Google fonts.
Poppins is optimized for print, web, and mobile interfaces, and has excellent legibility characteristics in its letterforms.
Poppins has several font weights, but we stick to 3:
- Light 300 - used for text summaries, body text.
- Medium 500 - used for bodytext alternatives, buttons and highlights
- Semi-bold 600 - used for headings
Colors:
- Body text should be set in text-black, or dark gray
- Contrast colors in texts - links only
- Ensure good readability - check contrasts and bleed, especially for digital applications.
- If white text is used on other background colors than the blue options, font size and weight should be adjusted for legibility.
- System: Digital surfaces should respect WCAG for contrast and readability. See contrast checker
- Please note: we do not use Capitalized letters or extra bold in headings after brand update 2022.
Decor font:
In contrast, the decor font we use - Caveat - should be used sparingly, and preferrably after discussion with the design team. It is also a free font available at Google fonts.
Caveat is a handwriting type family designed by Pablo Impallari. It is designed for both short annotations and body text usage.
Typefaces/fonts - typography
Poppins
230130: New previews will be added when we change typefaces on our web sites. This page is using the correct Poppins font.
For now, see more at Google fonts →
Intital details:
Headings: semibold 600
Summaries and body text: 300, with bold option 500.
Buttons: medium 500
Caveat bold
Caveat regular
Use with caution
Note mismatch in sizing/spacing compared to Open Sans. Requires adjustments.
This font should not carry critical information. It may be used in banners, illustrations and other decorative elements, but should not replace normal text, headings etc.
It should never be used to the extent that it claims too much focus from our primary typefaces.
