TYPOGRAPHY

HOW TO USE

TYPEFACE OVERVIEW

Lexend

UI, headings, navigation, long-form reading

Lora

Emphasis, editorial moments

Accessibility Foundation (ADA / WCAG)

Key Rules


Minimum body text: 16px

Avoid ultra-light weights for readability

Maintain consistent spacing and hierarchy

Base Settings


Base font size: 16px

UI ELEMENTS

Buttons


Font: Lexend Semi-Bold

Size: 16–18px

Navigation


Font: Lexend SemiBold

Size: 16–18px

Labels


Font: Lexend SemiBold

Size: 14-16px

This is a Button

Button

Spacing System

Paragraph Spacing


1–1.5x line height between paragraphs

Section Spacing


24px–48px between text blocks

Max Line Length


60–75 characters per line

BEST PRACTICES

DOS


Use Lexend for clarity-heavy UI and structure

Use Lora for call-outs

Keep hierarchy obvious and consistent


DON’TS


Use too many font weights

Go below 16px for body text

Over-compress line height