Typography

Selecting a distinctive font on your site, in combination with a deliberate tone of voice provides added depth to your brand’s identity.

Your language and font choice help build up an image in the customer’s mind of the way you operate as a business.

We'll guide you through the Font options available within the Envy theme.

Getting Started

From your Shopify dashboard, navigate the following steps:

  1. Online Store → Themes

  2. Theme Settings

  3. Select Typography from the Menu.

Note:

If your looking to use your own custom fonts, not present with the theme - we have a great guide on Custom Fonts provided here.

Settings

Headings

This is the text that appears at the top of most sections on your storefront.

Font

Choose from a selection of serif, sans-serif, cursive and monospace fonts

Heading Case

Set the case of the Heading text. This styles how the font looks and can be set to Lowercase, Uppercase or Normal case (Sentences beginning with a capitalised letter).

Size

Set the size of the Heading font out of Small, Medium and Large.

Subheadings

Font

Select a font for your subheadings on the homepage.

Subheading case

Select a case style for your Subheading.

Body Text

Font

Choose from a range of body text fonts, selected by our design team, to maximize readability.

Note:

Changing this font will change the Blog post font, and any other font included in the Body that is not a header, or within an object.

Base size

This slider sets the size for the majority of text on your site. In some cases we use slightly smaller / larger text in sub-headings etc. but based on your font choice, you might want to increase or decrease the base size of the font.

These font options change the navigation menu text. This includes all menu items, as-well as submenu items.

Font

This dropdown selector chooses another Font setting to reference for its Navigation. This can be set to either Body or Subheading.

For example, if Body is selected, the font selected for the Body will replicate as the Navigation font.

Capitalize Navigation

Toggle to enable/disable uppercase letters for the Navigation.

Buttons

Font

Buttons can be referenced to either the Font of the Body, or Subheading's.

Capitalize Buttons

Enable/disable the checkbox to turn the Font to uppercase.

Older theme settings

As of Envy 26.0, we've simplified the typography settings inside the theme. If you are running an early version of Envy, setting descriptions for these options can be found below.

Announcement Bar

Versions pre Envy 26.0 will have the option to edit the Font for Announcement bars. Changes the text style displayed when the announcement bar is enabled.

Font

Choose from a range of body text fonts, selected by our design team, to maximize readability.

Base size

This slider sets the text size for your announcement bar.

Bold text

This toggles between bold and non-bold text.

‘Add to cart’ Buttons

Changes the text displayed inside the Add to Cart buttons. This is a unique setting and will only apply to the Add to Cart buttons. To change the more common buttons Font, see Button Case.

Size

Changes the size of the text inside the Add to cart buttons.

Button case

Text displayed inside general buttons can be edited here. This includes buttons located inside of sections.

Note: Add to Cart buttons are not effected by these settings and have their own settings to edit the font and display. See 'Add to Cart' buttons in this documentation.

Choose from Body & Subheading in the Font setting:

Select Capitalize buttons to choose uppercase text:

Tip

Remember, you can also change the colors in the 'color' section of your ‘general settings’.

Custom Fonts

Fonts can be uploaded to the assets folder and reference inside your themes CSS file. For a detailed guide on how to upload custom fonts, see our guide below:

For more information, Shopify also provides documentation on Fonts: