The Global Color Settings section allows you to customize various color elements throughout your Shopify theme. These settings include options for General elements, Product Badges, and Alerts.

In the General subsection, you can adjust the color scheme for various general elements across your store, for example, Image background and divider

The Product Badges subsection allows you to configure the text and background colors for product labels.

• Text Color: Specifies the color of the text displayed on product badges.
• Background Color: Determines the background color of product badges.

In the Alerts subsection, you can customize the colors for global alert messages displayed on your Shopify store.

• Text Color: Sets the color of the text within alert messages.
• Background Color: Specifies the background color of alert messages.

Header & Footer color

The Header & Footer subsection enables you to change the color styling for the Header, Submenu, and Footer sections.

• Header Color: Defines the color scheme for the header section of your store.
  
• Submenu Color: Sets the color styling for submenu items within the header.
  
• Footer Color: Specifies the color scheme for the footer section of your store.
  

Colors

The Color Settings section allows you to apply predefined color schemes to sections throughout your online store.

• Color Schemes: Predefined color schemes that can be applied to various sections of your online store for consistent styling. You can read more about Shopify Color schemes here.

Typography

The Typography Settings section enables you to customize the font styling for headings and body text.

• Heading Font Family: Select the font family for headings used across your Shopify store.
• Body Font Family: Choose the font family for body text content.
• Font Scale: Adjust the scaling of font sizes for consistent typography.
• Line Height: Set the spacing between lines of text for improved readability.
• Letter Spacing: Control the spacing between letters within text elements.

Animation

The Animation Settings section allows you to enable or disable animation effects throughout your Shopify theme.

• Enable Animation: heckbox option to enable or disable animation effects in your Shopify store.

Layout

The Layout Settings section enables you to customize the styling for various elements' width and radius.

• Width: Adjusts the width of elements such as boxes, product grids, buttons, and input fields.
• Radius: Sets the corner radius for elements such as boxes, product grids, buttons, and input fields.

Swatches

The Swatches Settings section allows you to configure the behavior and appearance of product variant swatches.

• Show Variant Image as Color Swatch: Checkbox option to display variant images as color swatches.
• Color Options Name: The option that triggers the swatch functionality, such as "Color" or "Material". You can have multiple triggers by separating the options with commas.
• Custom Colors: Define custom colors for swatches using hex codes or PNG images uploaded to the Content > Files page.
• Size Options Name: The option that represents the product size.

Product

The Product Settings section allows you to customize various aspects of product display and functionality.

• Enable Preorder: Enables preorder functionality for products. Preorder will work when the "Continue selling when out of stock" option is enabled on the product editor.
• Show Saved Amount: Checkbox option to display the saved amount on discounted products.
• Option Style: Choose between Dropdown or Swatch for displaying product options.

Product Card

The Product Card Settings section allows you to customize the appearance and content displayed on product cards.

• Text Alignment: Choose between Left, Center, or Right alignment for the text on product cards.
• Show Quick View: Checkbox option to enable the quick view feature on product cards.
• Enable Border: Add a border around product cards.
• Enable Background: Add a background color to product cards.
• Show Second Image on Hover: Display the second product image when hovering over the product card.
• Show Product Vendor: Display the product vendor information on product cards.
• Show Product Rating: Requires a product rating app. Checkbox option to display product ratings on product cards.
• Enable Swatches: Checkbox option to enable swatches on product grid for variant selection.

Product Badges

The Product Badges Settings section allows you to customize the badges displayed on product cards.

• Show Sale Badge: Checkbox option to display a sale badge on products that are on sale.
• Show Sold Out Badge: Checkbox option to display a sold out badge on products that are out of stock.
• Show PreOrder Badge: Checkbox option to display a preorder badge on products. This badge will only be enabled if "Continue selling when out of stock" is enabled.
• Custom Badges: Display custom badges for products based on specific tags.
  • Product Tag: Add the product tag here for which you want to display a custom badge.
  • Product Text: Enter the text for the custom badge.

Social Media

The Social Media Settings section allows you to add the URLs for your social media profiles.

• Social Media Profile URLs: Enter the URLs for your social media profiles, such as Facebook, Twitter, Instagram, etc.

Gift Card

The Gift Card Settings section allows you to customize the appearance of gift cards.

• Upload Logo: Upload a logo to be displayed on the gift card.
• Logo Width: Specify the width of the logo on the gift card.

Search Drawer

The Search Drawer Settings section allows you to configure various aspects of the search functionality.

• Enable Search Drawer: Enable the search drawer.
• Enable Related Queries: Enable related queries in search results.
• Enable Collections: Enable fetching collections in search results.
• Enable Pages: Enable fetching pages in search results.
• Enable Articles: Enable fetching articles in search results.
• Search Suggestions: Enable search suggestions.
  • Heading: Title for the search suggestion section.
  • Queries: Specify search queries separated by commas “,” for multiple queries.
• Product Suggestions: Enable product suggestions
  • Heading: Title for the product suggestion section.
  • Products: Select desired products to be used for suggestions.

Cart Drawer

The Cart Drawer Settings section allows you to configure various options related to the cart drawer.

• Enable Cart Drawer: Enable the cart drawer.
• Enable Cart Note: Enable the cart note feature.
• Shipping Estimate: Enable the shipping estimate functionality.

These settings control the scrolling content within the cart drawer.

• Enable Content: Enable or disable scrolling content in the cart drawer.
• Text Field: Add a custom message here for scrolling content.
• Categories:
  • Enable Categories: Enable or disable categories.
  • Heading: Specify a heading for the categories.
  • Collections: Select collections to be featured.
• Upsell:
  • Enable Upsell: Enable or disable upsell
  • Heading: Specify a heading for the upsell section.
  • Products: Select products to be displayed.

Checkout

The Checkout Settings section allows you to customize the appearance and layout of the checkout page, including settings for Shopify's new Custom accounts. Please note that the Checkout process is purely handled by Shopify and not on the theme level. Any issues or questions relating to the checkout should be addressed to Shopify support.

• Banner: Upload a background image for the checkout page.
• Logo: Upload a logo to be displayed on the checkout page.
• Position: Choose the position of the logo on the checkout page: Left, Right, or Center.
• Logo Size: Select the size of the logo: Small, Medium, or Large.
• Main Content:
  • Background Image: Upload a background image for the main content area.
  • Background Color: Set the background color for the main content area.
  • Form Fields: Choose between white or transparent background for form fields.
• Order Summary:
  • Background Image: Upload a background image for the order summary section.
  • Background Color: Set the background color for the order summary section.
• Typography:
  • Heading: Customize the typography for headings.
  • Body: Customize the typography for body text.
• Color:
  • Accents: Customize the color scheme for accents.
  • Buttons: Customize the color scheme for buttons.
  • Errors: Customize the color scheme for error messages.
• Checkout Layout: Choose between One Pager or Three Pager layout for the checkout process.

Custom CSS

The Custom CSS Settings section allows you to add custom CSS to your theme.

• Custom CSS : Enter your custom CSS code here to apply additional styling or modifications to your theme. You can Learn more.