Wilfrid Laurier University Design System
/foundations/typography/

Typography

Typography creates a clear visual hierarchy and makes it easy to see the structure of content. Keeping consistent typographic styles ensures the visual aesthetic is simple and clean.

Font Families

Calluna Sans
Calluna

Calluna Sans is friendly and modern, and should be the primary font used for headings and body copy on Laurier’s web properties and other digital applications.

Calluna is a serif font. It has a professional feel to it and is helpful in capturing the weight of Laurier’s rich history. Calluna should be used sparingly in digital applications.

Type Scale

For websites and digital applications, Laurier uses the major third type scale (1.250) with a base font size of 18px.

The quick brown fox jumps over the lazy dog.

h1 size: 1.95rem weight: 900 line-height: 1.3

The quick brown fox jumps over the lazy dog.

h2 size: 1.56rem weight: 600 line-height: 1.3

The quick brown fox jumps over the lazy dog.

h3 size: 1.25rem weight: 700 line-height: 1.3

The quick brown fox jumps over the lazy dog.

h4 size: 1rem weight: 700 line-height: 1.3

The quick brown fox jumps over the lazy dog.

h5 size: 0.83rem weight: 700 line-height: 1.3

The quick brown fox jumps over the lazy dog.

h6 size: 0.67rem weight: 700 line-height: 1.3

The quick brown fox jumps over the lazy dog.

body size: 1rem weight: 500 line-height: 1.4

Best Practices

Lorem ipsum dolor sit amet, consectetur adipiscing elit. Nulla mattis tortor nunc. Curabitur odio mi, vehicula id euismod ut, volutpat molestie dolor. Praesent ut malesuada dolor, a vestibulum ante. In id rutrum ligula. Quisque dapibus vestibulum diam.