Typography

Theme settings - Typography

Typography settings allow you to define the style, size, and format of text across your store, ensuring a cohesive and readable design that aligns with your brand identity.

In the theme editor, click the Theme settings, then click to open the Typography tab.

1. Headings:

These settings control the font and appearance of all headings throughout your store.

  • Font : Select a font from the Shopify font library to apply to headings in all sections.

  • Font size (Slider: 50% → 150%): Adjust the font size of headings to scale their prominence.

  • Text case: Choose how the text case of headings appears.

    • Default: Retains the natural text case of your input.

    • Lowercase: Converts all text to lowercase.

    • Uppercase: Converts all text to uppercase.

    • Capitalize: Capitalizes the first letter of each word.

2. Body:

Settings that control the font and style of the body text, which appears in descriptions, paragraphs, and supporting content.

  • Font: Choose a font from the Shopify font library to apply to body text.

  • Font size (Slider: 50% → 150%): Adjust the size of body text for better readability.

3. Buttons:

Control the font used in all buttons across your store.

  • Font: Select a font for button text to ensure consistency with your brand style.

4. Navigation:

Manage the typography for navigation menus, including font and text formatting for all menu links.

  • Font: Choose whether the navigation menu text uses the Body or Heading font.

  • Font size (Slider: 50% → 150%): Adjust the size of navigation text for enhanced visibility.

  • Header menu text case: Define the text case for top-level links in the header menu.

    • Default: Retains the natural text case of your header menu.

    • Lowercase: Converts all text to lowercase.

    • Uppercase: Converts all text to uppercase.

    • Capitalize: Capitalizes the first letter of each word.

5. Announcement:

Typography settings for the announcement bar, often used to display promotional or informational messages.

  • Font: Choose whether the announcement bar text uses the Body or Heading font.

  • Font size (Slider: 50% → 150%): Adjust the size of the text in the announcement bar for clarity and emphasis.

Last updated

Was this helpful?