Typography
Our typefaces are friendly, clear, and professional.
Font Weights
Aa
Regular
Aa
Medium
Aa
Semi Bold
Aa
Bold
Aa
Extra Bold
Type Scale
Hierarchy
Speech Therapy for Every Child
We provide personalized speech therapy services designed to help your child communicate with confidence.
Font Usage
League Spartan
Use only for headlines. Its bold geometric forms create impact and establish visual hierarchy. Never use for body text or UI elements.
Poppins
Use for everything else. Body text, UI elements, buttons, labels, navigation, and any text that isn't a headline. Its geometric design pairs perfectly with League Spartan.
Line Height
1.1 – 1.2Headlines and display text use tight leading.
Use for headlines, hero text, and large display typography.
1.5 – 1.6Body text uses normal line height for comfortable reading at standard sizes.
Use for paragraphs, descriptions, and UI text.
1.7 – 1.8Small text and captions benefit from extra breathing room to maintain readability.
Use for small text, captions, and dense content.
Letter Spacing
-0.02em to 0Tight tracking for impact
Large headlines can use slightly tighter tracking for a more cohesive appearance.
0 (default)Standard tracking for readability
Body text should use default letter spacing for optimal legibility.
0.05em to 0.1emWider tracking for labels
Uppercase text and small labels benefit from increased letter spacing.
0.02em to 0.04emSlightly wider for buttons
Button text can use subtle tracking to improve tap target clarity.
Accessibility
Minimum Sizes
- Body text: 16px minimum for comfortable reading
- Secondary text: 14px minimum for labels and captions
- Small text: 12px only for non-essential info
Color Contrast
- Normal text: 4.5:1 contrast ratio minimum
- Large text (18px+): 3:1 contrast ratio minimum
- Abyss on Cloud: 15.6:1 ratio (excellent)
Best Practices
Do's and Don'ts
- • Use League Spartan only for headlines
- • Use Poppins for everything else
- • Maintain clear visual hierarchy with size and weight
- • Keep body text at 16px or larger
- • Use bold weights sparingly for emphasis
- • Pair bold headings with regular body text
- • Allow sufficient line height for readability
- • Use League Spartan for anything other than headlines
- • Mix more than 2-3 font weights on a page
- • Set text smaller than 12px
- • Use light weights (300 or below)
- • Stretch, skew, or artificially style fonts
- • Use long passages of uppercase text
- • Ignore contrast requirements