# Typography

Typography defines the fonts used across text elements in the experience, including headings, inputs, buttons, and links.

<figure><img src="https://3302412606-files.gitbook.io/~/files/v0/b/gitbook-x-prod.appspot.com/o/spaces%2FPzuLy4HwYJtL2cvBab9d%2Fuploads%2FrZQS1o0m4LA93FA47lk3%2FScreenshot%202026-03-19%20at%2014.36.57.png?alt=media&#x26;token=06826293-0a1c-4e7d-9542-5e98219463cc" alt=""><figcaption></figcaption></figure>

***

#### What you can customize

**Global Custom Font**

* Set a default font applied across the entire interface
* Choose from free Google Fonts or upload your own font
* Each font family supports two different weights, bold and normal

If uploading your own custom font:

* Supported font formats include woff2, woff, eot, svg, otf, and ttf. If possible, using woff2 fonts is optimal. There are free online converters for this such as [this one](https://fontsource.org/tools/converter).
* Make sure to upload both a regular and a bold version of your font. The bold and the regular font may or may not be a part of the same font family depending on your preferences.&#x20;
* To easily find local fonts you can use Font Book on Macs and Fonts inside control panel on Windows.
* After defining a global custom font you can optionally override that font for links, buttons (both buttons in general as well as specific buttons) as well as inputs.

**Text Colors**

* Configure text color for light mode
* Configure text color for dark mode
* When you define a custom text color, we do a [WCAG color contrast check](https://accessibleweb.com/color-contrast-checker/), and you're only able to save the color if contrast is higher than 3:1.

***

#### How it works

* Global font acts as the fallback across all components
* Component-level font settings override the global font
* Uploaded fonts become selectable throughout the system

***

#### Tips

* Stick to **1–2 fonts max** for a clean, professional look
* Ensure readability across sizes (especially for inputs and buttons)
* Avoid overly thin fonts for accessibility reasons
