Fonts & Colors

You can customize the fonts, font sizes, and colours for the body text, headings, buttons, and various other theme components in the typography settings.

Fonts

You can choose to display fonts from Shopify or Google. Select font to display from Font source.

Shopify Fonts

First select Shopify from Font source.

From the Shopify font library, you can choose up to three font families. It is advised to choose one or two font families. This will assist with site loading. Altering the font you choose can slow down your store.. Read more.

Google Fonts

First select Google from Font source.

From the Google Font Library, you can choose up to three font families. It is advised to choose one or two font families. This will assist with site loading. Altering the font you choose can slow down your store. Find google font name list here

Color Schemes

A color scheme refers to a set of colors that can be utilized for various sections. There exist predefined color schemes with specific themes that has been chosen for different sections and settings. Additionally, you have the option to create additional color schemes through the Theme settings and apply them according to your store's design. By default, color scheme 1 is assigned to sections or other theme elements that possess a white background and dark fonts.

Please refer to the attached document for a visual representation of how colors can impact the style of different sections.

Body Text

Select font family, set font size, line height ( space between 2 text lines), letter spacing ( space between letters) and color. Body text is used by default for various theme elements and sections.

Headings

Heading settings will be applied on all headings used on your store.

Select font family for headings and set font size, font weight, line height ( space between 2 text lines), letter spacing ( space between letters) and colors.

Form Fields

Set text color, background and border color for textbox or textarea on your store.

Buttons

You can style all the buttons that has been used throughout your store ( Exclude checkout page)

Select font family and set font size, font weight, font case and set border radius (Border radius makes button rounded corners)

There are total 3 buttons style available to use throughout layout.

You can set text, border, background and hover color for each button then you can select these button design from individual settings.

Breadcrumb

Set font size, text and background color for breadcrumbs that appear on top of every page.

Pages

Page title style that display on top of the page. Select page title font from Title Font dropdown and set font size, font weight and text align.

Popup

Set border radius to to create rounded corners for all pop ups appearing on your store.

Carousel

Set arrows and dotted navigation colors that display on carousel and slider.

Other Colors

Set colors for several basic theme elements , such as borders, tooltip text & background, theme color, and links you create with text.