> ## Documentation Index
> Fetch the complete documentation index at: https://growthmethod.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Typography

> TLDR; Use Inter

*TLDR; Use Inter*

We wanted a font that works across both website and application UI, one that works with small UI component labels, as well as longer playbook text. We're keen to avoid the premium commercial fonts, and remain open source.

### Font

We use the **Inter** across website and app. It is available through [Google Fonts](https://fonts.google.com/specimen/Inter).

Inter was designed by Rasmus Andersson, the principal designer at Figma. Tailwind use the Inter font on their own website and blog as well [<u>https://tailwindcss.com/</u>](https://tailwindcss.com/). Inter is often considered a premium upgrade to Source Sans.

### Typography notes

* Start with a sensible base value e.g. 16px, since it's the default font size for most browsers.
* Consider non-linear type scales (e.g. Refactoring UI) was modular type scale (e.g. perfect fifth or golden ratio) as per [<u>https://type-scale.com/</u>](https://type-scale.com/)
* When working with a type scale it is best to avoid em units, and stick to px or rem units
* Here are some good notes on font choice [<u>https://www.learnui.design/blog/mobile-desktop-website-font-size-guidelines.html</u>](https://www.learnui.design/blog/mobile-desktop-website-font-size-guidelines.html)