# 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](https://shopify.dev/themes/architecture/settings/fonts#available-fonts).

In the theme editor, click the **Theme settings** icon, then click to open the **Fonts** tab.

{% hint style="info" %}
See our blog post on [Choosing the best font pairings for your store](https://fluorescent.co/blog/font-pairing) for helpful tips and some handpicked examples.
{% endhint %}

### Font elements

***

Font settings are available for the following elements across your site.

<table><thead><tr><th width="245">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:blue;">Logo</mark></td><td>Your store name in the Header (when no logo image).<br><br>Go to your Shopify admin Preferences to edit your store name under Store details.</td></tr><tr><td><mark style="color:blue;">Headings</mark></td><td>All heading and subheading text.</td></tr><tr><td><mark style="color:blue;">Navigation</mark></td><td>All menu links in the header menus.</td></tr><tr><td><mark style="color:blue;">Body</mark></td><td>All remaining text including body text, navigation (menu items), product listing title, and button text.</td></tr><tr><td><mark style="color:blue;">Buttons</mark></td><td>All button text labels.</td></tr><tr><td><mark style="color:blue;">Product listing title</mark></td><td>The product title displayed for products that appear in sections and collections.</td></tr><tr><td><mark style="color:blue;">Product badges</mark></td><td>Sale and custom badges on products that appear in sections and collections.</td></tr><tr><td><mark style="color:blue;">Prices</mark></td><td>All prices as they appear in product listings, collections, and product pages.</td></tr></tbody></table>

### Font settings

***

The following font settings are available for the above font elements across your site.

<table><thead><tr><th width="238">Setting</th><th>Description</th></tr></thead><tbody><tr><td><mark style="color:blue;">Uppercase</mark></td><td>Display font in all uppercase letters.</td></tr><tr><td><mark style="color:blue;">Desktop font size</mark></td><td>Use the slider to increase or decrease the font size in pixels.</td></tr><tr><td><mark style="color:blue;">Mobile font size scale</mark></td><td>Use the slider to increase or decrease the font size on mobile as a percentage of the base font size.</td></tr><tr><td><mark style="color:blue;">Letter spacing</mark></td><td>Use the slider to increase or decrease space between letters.</td></tr><tr><td><mark style="color:blue;">Bold</mark></td><td>Apply bold text style.</td></tr></tbody></table>

<br>

***

> **Related links**
>
> [Theme settings](/cornerstone/theme-styles/theme-settings.md)\
> [Style presets](/cornerstone/theme-styles/style-presets.md)\
> [Colors](/cornerstone/theme-styles/colors.md)\
> [Fonts](/cornerstone/theme-styles/fonts.md)\
> [Animation](/cornerstone/theme-styles/animation.md)


---

# Agent Instructions: Querying This Documentation

If you need additional information that is not directly available in this page, you can query the documentation dynamically by asking a question.

Perform an HTTP GET request on the current page URL with the `ask` query parameter:

```
GET https://help.fluorescent.co/cornerstone/theme-styles/fonts.md?ask=<question>
```

The question should be specific, self-contained, and written in natural language.
The response will contain a direct answer to the question and relevant excerpts and sources from the documentation.

Use this mechanism when the answer is not explicitly present in the current page, you need clarification or additional context, or you want to retrieve related documentation sections.
