Fonts
A wide selection of Fonts are available for the logo, headings, body text, and buttons. These fonts are applied site-wide. All fonts are provided by Shopify's font picker. See a full list of fonts supported by Shopify.
In the theme editor, click the Theme settings icon, then click to open the Fonts tab.
See our blog post on Choosing the best font pairings for your store for helpful tips and some handpicked examples.
Headings
Select the font for headings of sections and pages.
Setting | Description | Options |
---|---|---|
Casing | Display text in all uppercase letters or use the casing of the text as entered in the heading fields. | Normal Uppercase |
Letter spacing | Adjust the space between letters for headings of sections and pages | -2.5 - 2.5 |
Desktop font size | The font size (in pixels) for section and page headings. | 24 - 72 |
Mobile font size scale | Adjust the heading text size on mobile as a percentage of the desktop size. Set it to `100%` to use the same text size as desktop. | 50 - 100 |
Body text
Select a font for body text and descriptions.
Setting | Description | Options |
---|---|---|
Casing | Display text in all uppercase letters or use the casing of the text as entered. | Normal Uppercase |
Letter spacing | Adjust the space between letters for body text and descriptions. | -2.5 - 2.5 |
Desktop font size | The font size (in pixels) for body text and labels. | 15 - 22 |
Mobile font size scale | Adjust the body text size on mobile as a percentage of the desktop size. Set it to `100%` to use the same text size as desktop. | 50 - 100 |
Navigation
Select a font for navigation text and menu links in the header.
Setting | Description | Options |
---|---|---|
Casing | Display text in all uppercase letters or use the casing of the text as entered. | Normal Uppercase |
Letter spacing | Adjust the space between letters for navigation text and menu links in the header. | -2.5 - 2.5 |
Desktop font size | The font size (in pixels) for navigation links in the header. | 24 - 72 |
Buttons
Select a font for all button labels.
Setting | Description | Options |
---|---|---|
Casing | Display text in all uppercase letters or use the casing of the text as entered. | Normal Uppercase |
Letter spacing | Adjust the space between letters in button labels. | -2.5 - 2.5 |
Last updated