Typography
INFO
To use our Tailwind utility classes and have our colors, you must install our tailwind your first
Follow steps in Tailwind configuration documentation
Font Family
Helvetica Neue
Text Weight
Aa
regular Tailwind: font-normalAa
medium Tailwind: font-mediumAa
bold Tailwind: font-boldText Style
| Name | Weight | Size | Line Height | Tailwind | Sample |
|---|---|---|---|---|---|
| Title 1 | Bold | 24px | 37px | title-1 | It’s not about a brand, it’s about a style |
| Title 2 | Bold | 20px | 24px | title-2 | It’s not about a brand, it’s about a style |
| Text 1 | Bold | 16px | 24px | text-1 | It’s not about a brand, it’s about a style |
| Text 2 | Bold | 14px | 17px | text-2 | It’s not about a brand, it’s about a style |
| Text 3 | Regular | 14px | 17px | text-3 | It’s not about a brand, it’s about a style |
| Text 4 | Bold | 12px | 15px | text-4 | It’s not about a brand, it’s about a style |
| Text 5 | Regular | 12px | 15px | text-5 | It’s not about a brand, it’s about a style |
| Caption 1 | Regular | 10px | 12px | caption-1 | It’s not about a brand, it’s about a style |