# Typography

{% hint style="info" %}
**Theme settings -> Typography**
{% endhint %}

## Body

 In this section, you can change the font of the body’s content by choosing the one you like from the **“Base font family”** list:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mf2qPrpCDM5UmPfCpCq%2F-Mf2sY3V2Xk-0mk2gzIn%2FScreenshot_16.png?alt=media\&token=15ca9503-80ce-45d8-b7a8-905aa06a752a)

 If you want to choose a different font for headings, buttons, inputs, or menu, disable the option **“Apply font to all elements ignoring everything except alternate font”**:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mf2sq80mj6L-6j3ecdc%2F-Mf2tDRR1yDsnqRlz6Pj%2FScreenshot_17.png?alt=media\&token=49e2b0c7-dba6-4fd9-871d-66e71ca7b6b3)

 In the dropdown list **“Load additional style”**, you can choose an additional style for the font family**:** Bold, Italic, Bold & italic, Bold italic. Choose “None” if you do not want to apply any style.

 On the **“Base font size”** scale from 10 to 60 px, you can choose the size of the base font.

## Heading

 Here you can customize the font for the headings in your store. In the **“Font family”**, you can change the font of all your headings:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mf2sq80mj6L-6j3ecdc%2F-Mf2ucrahOd4woQ4aONP%2FScreenshot_18.png?alt=media\&token=7d69c540-39d9-474a-bd6a-acb169d1098d)

 In the dropdown list **“Load additional style”**, you can choose an additional style for the font family**:** Bold, Italic, Bold & italic, Bold italic. Choose “None” if you do not want to apply any style.

 On the **“Promo box large text size, h1”** and **“Promo box text size, h2”** scales from 10 to 100 px you can change the size of the text in banners.

 We chose the Type #1 v1 (Text over the image) for the Promo box (Banner) in the "Layout" block. And changed the h1 to 44 px. And this is what we have got:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mf2yZpCbMd7lzkvIu2n%2F-Mf3-9BL67i9UOtU8URq%2FScreenshot_19.png?alt=media\&token=6261ae14-d502-4f8a-abcf-9829beb045c3)

 And for this example, we chose the Type #1 v17 for the Promo box (Banner) in the "Layout" block:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mg5qMMA814D5IY8Wqx2%2F-Mg5sA59Cz0YcPc57EsR%2FScreenshot_17.png?alt=media\&token=1198ff92-4561-43c4-bcfc-4d56a2aba962)

 On the **“Page title size, h3”** scale from 10 to 60 px, you can change the size of the title on pages:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mf3-Py9x3yIxwO7sYZU%2F-Mf30Z8hHQf3RloczWbK%2FScreenshot_20.png?alt=media\&token=88d9bb07-c7bd-4e08-91b5-0dd2ce577f70)

 On the **“Section title size, h4”** scale from 10 to 60 px, you can change the size of the section’s title on any page:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mf3-Py9x3yIxwO7sYZU%2F-Mf312syVikps_GwxSTP%2F07-06-section-title-size.png?alt=media\&token=e4b333b7-65f8-43a4-b832-bb75bc8f6f66)

 On the **“Menus title size, h5”** scale from 10 to 60 px you can change the size of the menu’s title on any page:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mf3-Py9x3yIxwO7sYZU%2F-Mf30u2h5-28LcwgWpxZ%2F07-06-menu-title-size.png?alt=media\&token=8567d8c7-daed-4130-8649-a754d0e6b19a)

 On the **“Highlighted text size, h6”** scale from 10 to 60 px you can change the size of the product title and product type in collections:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mf3-Py9x3yIxwO7sYZU%2F-Mf33_5f1R2W9StOvd_I%2FScreenshot_21.png?alt=media\&token=50726de6-d8b0-4173-ab15-afeca0131eaa)

## Button & Input

 In the **“Button font family”**, you can change the font of the buttons:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mf6ZYKzO5DYn2SbSvKo%2F-Mf8-KBkkr2-ORwC2PNF%2F07-06-button-font-family.png?alt=media\&token=7fb9d91b-ec7c-4c7d-ba3b-1a34675fb47f)

 On the **“Button font size”** scale from 10 to 60 px, you can change the size of the button text. On the **“Input font size”** scale from 10 to 60 px, you can change the size of the input, e.g.: placeholder’s text:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mf6ZYKzO5DYn2SbSvKo%2F-Mf8-MS-LQ2pqCn9PCQc%2F07-06-input-font-size.png?alt=media\&token=d54c7610-d194-4098-be1f-49ecdee79e01)

## Menu

  In this section, you can change the font of the menu by simply selecting the proper one from the list in the **“Font family”:**

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mg5h3MwdLpLGPF0Dtp2%2F-Mg5hw4iXkPmn3NMAoR-%2F07-06-menu-font.png?alt=media\&token=e91f9dba-ec94-43ba-be00-afdeb5039a40)

 On the **“First level font size”** scale from 10 to 60 px, you can change the size of the menu text on the first level:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mg5h3MwdLpLGPF0Dtp2%2F-Mg5hj8Xy5-Bpse83KC6%2F07-06-first-level-font-size.png?alt=media\&token=cd1d6a15-9839-4534-9d3c-68a5245795a2)

  On the **“List font size”** scale from 10 to 60 px, you can change the size of the font in the menu list:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mg5h3MwdLpLGPF0Dtp2%2F-Mg5i0E22ZgGPNFfD9yC%2F07-06-list-font-size.png?alt=media\&token=2bf213b4-211c-442c-8033-cf15b72c49e5)

 On the **“Title font size”** scale from 10 to 60 px, you can change the size of the font in the titles of the menu:

![](https://1204500216-files.gitbook.io/~/files/v0/b/gitbook-legacy-files/o/assets%2F-McsaSlZSE2uMqzAxy2S%2F-Mg5h3MwdLpLGPF0Dtp2%2F-Mg5i2UmE4LcBWtOCNSw%2F07-06-title-font-size.png?alt=media\&token=73d3adcd-6090-44af-bba0-7595159360b5)

 On the **“Mobile menu font size”** scale from 10 to 60 px, you can change the menu font size for the mobile version.

## Alternative font family

 In this section, you can add the class 'ff-alternative' to any element to apply this font family.

 You can change the font of the element by choosing the one you like from the **“Font family”** list.

 In the dropdown list **“Load additional style”**, you can choose an additional style for the font family**:** Bold, Italic, Bold & italic, Bold italic. Choose “None” if you do not want to apply any style.