Skip to content
This typographical scale is comprised of a subset of the existing text styles currently used in QuickBooks. By narrowing down the number of available font sizes, we ensure consistency across the site. This will help pave the way to an improved typographical scale using the new math in future versions of our design system.
If at any point you encounter a font size that is not represented on this subset, please choose the nearest value according to the hierarchical requirements in your design.
Available text sizes
Geogrotesque is a display font and should only be used as such. It is used as a headline in the badge and sometimes as text in advertisements and other publications. In digital environments, it is available in three sizes.
AvenirNext forINTUIT is our body font and has four styles: Regular, Medium, Demi and Italic.
|Xtra-Large Numerals||Geogrotesque Medium (500) – 40px / 40px|
|Large Numerals||Geogrotesque Medium (500) – 28px / 32px|
|Headline 1||Geogrotesque Medium (500) – 24px / 28px|
|Headline 2||AvenirNext forINTUIT Medium (500) – 22px / 24px|
|Title||AvenirNext forINTUIT Medium (500) – 19px / 24px|
|Subheadline||AvenirNext forINTUIT Medium (500) – 16px|
|Body 1||AvenirNext forINTUIT Regular (400) – 16px / 23px line height|
|Body 2||AvenirNext forINTUIT Regular (400) – 14px / 20px line height|
|Table Headings||AvenirNext forIntuit Regular All Caps (600) – 12px|
|Caption 1||AvenirNext forINTUIT Regular (400) – 12px / 16px line height|
|Caption 2||AvenirNext forIntuit Regular All Caps (600) – 12px|
|Ghost Text||AvenirNext forINTUITItalic (400) – 14px / 20px line height|
Core typography guidelines
- Create clear visual hierarchy
- Minimize use of styling and color per page
- Avoid uppercase
- Headlines should be short and no more than 2-3 lines.
- Avoid using as plain body text, because it works best as a display font.
Thank you for your feedback
We got it! Thanks for sharing your thoughts with the QuickBooks Design System team. Your feedback helps us make the system better!