This repository has been archived by the owner on Jan 18, 2023. It is now read-only.
-
Notifications
You must be signed in to change notification settings - Fork 5
Typography
will-nemo edited this page May 7, 2020
·
2 revisions
Back to CSS Guidelines
- Logo Font: Geosans light (https://www.dafont.com/geo-sans-light.font)
- UI Font: Assistant (https://fonts.google.com/specimen/Assistant)
- Letter Spacing: -1.5px
- Weights: 300 (Light)
- Letter Spacing: -0.5px
- Weights: 300 (Light)
- Letter Spacing: 0px
- Weights: 400 (Regular)
- Letter Spacing: 0.25px
- Weights: 400 (Regular)
- Letter Spacing: 0px
- Weights: 400 (Regular)
- Letter Spacing: 0.15px
- Weights: 500 (Medium)
- Letter Spacing: 0.15px
- Weights: 400 (Regular)
- Letter Spacing: 0.15px
- Weights: 500 (Medium)
- Letter Spacing: 0.5px
- Weights: 400 (Regular)
- Letter Spacing: 0.25px
- Weights: 400 (Regular)
- Letter Spacing: 1.25px
- Weights: 500 (Medium)
- Letter Spacing: 0.4px
- Weights: 400 (Regular)
- Letter Spacing: 1.5px
- Weights: 400 (Regular)
- Line lengths for body text should ideally be between 40 to 60 characters (8-10 words).
- In cases with wider line lengths, such as desktop, longer lines should have an upper cap of 120 characters.
- As the line increases in length, the line height should be increased accordingly. Use the following formula: Adjusted line height = Baseline height * 1.2
- A text’s line height is proportional to its type size.
- To calculate line height for a type sample, use the following formula: Line-height = Font-size * 1.5
- Paragraph spacing should be 1.25x of the type size.
- To calculate the paragraph spacing for a type sample, use the following formula: Paragraph Spacing = Font-size * 1.25