TYPOGRAPHY DESIGN GUIDELINES

Conversational type…

Our typefaces help convey our messaging and have unique roles to play in helping to express and legibly demonstrate communications. Each typeface is selected for a purpose and it is important that various rules are used for consistency and ease of reading.

DOWNLOAD ALL FONTS

Typography overview

Our brand uses three key fonts (all supplied by Google Fonts). These fonts have been chosen for specific uses which keep communications vibrant and consistent.

typography overview LEARN MORE Consectetur inceptos congue accumsan consectetur rutrum tincidunt ullamcorper penatibus rhoncus montes parturient per aenean nec scelerisque neque vulputate aliquet. Euismod feugiat ullamcorper ridiculus suscipit. Headlines LABEL LABEL FONT PRIMARY FONT SECONDARY FONT CTA BUTTONS FONT LEARN MORE Consectetur inceptos congue accumsan consectetur rutrum tincidunt ullamcorper penatibus rhoncus montes parturient per aenean nec scelerisque neque vulputate aliquet. Euismod feugiat ullamcorper ridiculus suscipit. Headlines LABEL LABEL FONT PRIMARY FONT SECONDARY FONT CTA BUTTONS FONT

Primary font

PT Serif Regular

PT Serif Regular has great character when used with lots of space around it to help the elements breathe.

This font has a real conversational feel and can be used with confidence. We can highlight text in a number of ways.

PT serif font This is our headline font
DOWNLOAD PT SERIF REGULAR

Secondary font

Lato Regular

A friendly, clean and easy-to-read font for body copy, Lato Regular should be used for bulk text, and Lato Bold for copy titles. Lato Bold should also be used for button text.

lato font Body titles Body copy
DOWNLOAD LATO REGULAR

Label font

Overpass Extra Bold

Used for labels, and labelling sections - and should always be in uppercase. Because always uppercase, labels should be short for easy readability, and the font should always be used small so labels don’t overpower the headline font.

label font LABEL
DOWNLOAD OVERPASS EXTRA BOLD

Grouping

Here’s an example of how the three font styles work together as a set.

EXAMPLES OF GROUPING

Hero headline clear space

Our headline font should always stand out. So make sure you give it space to breathe and be expressive – a large clear space around it will do the trick.

clear space Real human connections in your digital space. X X X X X = FONT SIZE

EXAMPLE OF CLEAR SPACE

Small headline clear space

Our headline font should always stand out (even when it’s small). So make sure you give it the large, clear space around it that it needs to do that.

small headline clear space Sharing & collaboration technologies tailored to transform your enterprise. Euismod tellus enim a convallis consectetur luctus vestibulum a diam a cum habitant eu pulvinar ad amet pharetra litora tempor fames vestibulum suspendisse. FINANCIAL SERVICES LEARN MORE Headline font size Spacing (half)

EXAMPLES OF CLEAR ZONE

Headline Highlights

Ideal scenarios

To add to our collaborative tone (and to help highlight parts of text) we can use the two primary blues to create a hierarchy to the text. The examples below showcase scenarios in which to apply this hierarchy for impactful results.

first line Sharing & collaboration technologies tailored to transform your enterprise

THE FIRST LINE

last line Sharing & collaboration technologies tailored to transform your enterprise

THE LAST LINE

full line within Only Glance delivers real human connections to solve problems, sell, consult, and grow lifetime customer bonds.

FULL LINE WITHIN

sharing & collab Sharing & collaboration

WORD PAIRINGS