TGK Brand Fonts
Use these consistently across Canva, social graphics, and all TGK materials.
Primary Fonts
| Role |
Font Family |
Weight |
Canva Name |
Usage |
| Page Titles |
Cinzel |
600 (SemiBold) |
Cinzel |
H1, page titles, series titles, landing headings |
| Section Headings |
Cormorant Garamond |
700 (Bold) |
Cormorant Garamond |
H2, H3, card titles, badges, nav labels, section headings |
| Body Text |
Libre Baskerville |
400 (Regular) |
Libre Baskerville |
Paragraphs, lists, card descriptions, all copy |
Type Scale (actual site values)
These are the real sizes from the CSS. Base = 16px browser default.
| Element |
CSS class |
Token / Value |
Computed size |
| Page title |
.page-title |
--font-size-xl = 1.75rem |
28px |
| H1 (bare) |
h1 |
Browser default (2em of body) |
~34px |
| Sub-heading |
.sub-heading |
--font-size-lg = 1.5rem |
24px |
| Section heading |
.section-heading |
--font-size-lg = 1.5rem |
24px |
| H2 (bare) |
h2 |
Browser default (1.5em) |
~24px |
| H3 (bare) |
h3 |
Browser default (1.17em) |
~19px |
| Card title |
.card-title |
--font-size-md = 1.2rem |
19px |
| Index heading |
.index-heading |
clamp(1rem, 1.6vw, 1.5rem) |
16–24px |
| Nav text |
— |
--font-size-nav = 1.1rem |
18px |
| Body text |
body |
--type-body-size = 1.05rem |
17px |
| Copy / paragraphs |
p, li |
--type-copy-size = 1em |
17px (inherits body) |
| Small text |
.small |
--font-size-vs = 0.8rem |
13px |
| Logo text |
— |
--font-size-logo = 2rem |
32px |
Mobile overrides
| Element |
Mobile size |
| Page title |
--font-size-lg = 1.5rem (24px) |
| Section heading |
--font-size-base = 1rem (16px) |
Canva Quick Reference
For consistent social/marketing graphics, use these approximate sizes:
| Use |
Font |
Size (pt) |
Weight |
| Main headline |
Cinzel |
36–42pt |
SemiBold |
| Subheadline |
Cormorant Garamond |
24–28pt |
Bold |
| Section label |
Cormorant Garamond |
18–20pt |
Bold, UPPERCASE |
| Body copy |
Libre Baskerville |
14–16pt |
Regular |
| Card/badge text |
Cormorant Garamond |
14–16pt |
SemiBold |
| Small/caption |
Libre Baskerville |
10–12pt |
Regular |
Font Pairing Rules
- Titles + Body: Cinzel (title) over Libre Baskerville (body) — the core TGK look
- Headings + Body: Cormorant Garamond (heading) with Libre Baskerville (body)
- Display + Display: Cinzel (large) with Cormorant Garamond (smaller) — for graphics-only layouts
- Never mix with sans-serif unless explicitly required for UI elements
Letter Spacing
| Element |
Spacing |
| Page titles (Cinzel) |
0.02em |
| Headings (Cormorant) |
0.04em |
| Section headings |
0.05em |
| Badges |
0.05em |
Line Heights
| Element |
Line height |
| Body text |
1.85 |
| Copy / paragraphs |
1.6 |
| Index heading |
1.7 |
| Section heading |
1.1 |
Google Fonts Links
All three fonts are available on Google Fonts and in Canva by name:
- Cinzel: https://fonts.google.com/specimen/Cinzel
- Cormorant Garamond: https://fonts.google.com/specimen/Cormorant+Garamond
- Libre Baskerville: https://fonts.google.com/specimen/Libre+Baskerville