Theme Settings
Overview:
You can use theme settings to make changes to your online store’s typography, colors , social media links, cart etc. When you make changes to your theme settings, the changes apply to your entire online store.

Color Scheme:
From here, you can select the colors you want to use throughout the theme. You can create multiple unique color schemes and apply them to different sections throughout your online store.
Customize your color scheme:
- From your shopify admin, go to Online Store > Themes
- Click Customize next to the theme that you want to customize.
- Click the settings icon, and then click Color schemes.
- In the Schemes section, click an existing scheme or click Add scheme to add a new color scheme.
- Click the color swatch for the content type color that you want to change.
- To set your color, enter a hex color code or choose the color from the color picker. To set the color to transparent, delete the hex code from the text field.
- Click Save.
Layout Settings
Adjust the overall structure and spacing of your theme:
Setting |
Description |
|---|---|
| Page Width | Controls the maximum width of the page. Range: 1200px - 1700px. Default: 1440px. |
General Settings
General configurations for icons and currency.
Setting |
Description |
|---|---|
| Favicon | Upload a favicon icon for the browser tab. |
| Currency Format | Choose to display the currency code next to prices. Default: Disabled. |
Typography
Control fonts and text scaling:
Setting |
Description |
|---|---|
| Body Font | Choose a font for the site’s body text. Default: Poppins |
| Font Scale | Adjust the scaling percentage of text sizes. Range: 90% - 110%. Default: 100%. |
| Headings Font | Choose a font for headings. Default: Poppins |
Authentication Page:
You can set logo banner image for all Account pages. Note – Only visible for desktop.
Customize your Authentication pages:
- From your shopify admin, go to Online Store > Themes
- Click Customize next to the theme that you want to customize.
- Click the settings icon, and then click Authentication pages.
- Click on the change button to change the color scheme. By default color scheme 4 is applied for Authentication pages.
- By moving the range slider to change the Top/Bottom padding.
- Click Save.
Custom tags
Overview
Custom tags allow you to display special badge labels (such as Hot, Trend, or New) on product collections or items.
Each tag defines the tag name, background color, text color, title text color, and the collection handle where it will appear.
Tag Format
Each tag should be written inside curly brackets {} in the following order:
Format:
{Hot,#ff0000,#ffffff,#ffffff,collection-handle}||
{Trend,#000000,#ffffff,#ffffff,collection-handle}
Explanation of Fields
| Field | Description |
|---|---|
| TagName | The text that appears on the badge (e.g., Hot, Trend, New). |
| TagBackgroundColor | Hex color code for the badge background (e.g., #ff0000 for red). |
| TagTextColor | Hex color code for the text on the badge. |
| TitleTextColor | Hex color code for the title text (if applicable). |
| CollectionHandle | The handle (URL slug or identifier) of the collection where the badge will be displayed. |
Swatches Settings
Swatches view
Select how product swatches are displayed on your storefront.
Available options:
None – Disables swatches for product variants.
Native swatches – Displays color swatches using Shopify’s built-in functionality.
Color – Shows swatches using the color code or name defined in the Color swatch values field.
Image – Displays swatches using custom image files based on the color name.
Color swatch values
Define custom color swatches using color names and values.
Format: {ColorName,#HexCode} or {ColorName,ColorValue}
Separate multiple entries using ||.
Examples:
{Dark gray,#A9A9A9}
{Hot Pink,hot-pink.png} (for image-based swatches)
When using image swatches, upload a PNG file named to match the color name (spaces replaced by hyphens).
Example: Hot Pink → hot-pink.png
Custom Tags
Badge tags
Assign visual badges to specific product tags.
Format: {TagName,#TextColor,#BackgroundColor}
Separate multiple badges using ||.
Examples:
{New,#000000,#ffffff} – Displays a “New” badge with black text on a white background.
{Trending,#ffffff,#000000} – Displays a “Trending” badge with white text on a black background.
Cart Settings
Control the cart behavior and appearance:
Setting |
Description |
|---|---|
| Cart View | Choose between Drawer or Page cart styles. Default: Drawer. |
| Enable Cart Notes | Enable a field for cart notes. Default: Enabled. |
| Enable free shipping message bar | Select this checkbox to enable/disable the shipping bar on the cart. Note – This feature only works with a shipping method. If you’re using multiple shipping methods, it might show false values to the customers. Refer to Free shipping guide for more information on setting up the free shipping feature in Kidu. |
| Message | Type any relevant message to notify the users has reached the minimum shipping price. Note – Use ||amount|| to display the amount within the message. |
| Minimum shipping price | Type any price for providing free shipping to the customers. After reaching this price, the user will be shown a success message. Note – Users must write a number, no letters or special characters. |
| Enable vendor | Displays the vendors of the products. |
| Cart drawer Color Scheme | Choose a predefined color scheme to ensure consistency with the store’s branding. |
Social media:
Customize Social media:
- Click Theme settings > Social media.
- To add links to your social media accounts, enter the links to your accounts in the fields provided under Accounts. Enter full links, such as https://instragram.com/shopify , https://facebook.com/shopify .
- Click Save.
Gift Card Settings
Customize the appearance of gift cards:
| Setting | Description |
|---|---|
| Gift Card – Banner Image | The banner image appears at the top of the gift card page or section. Click Select to upload a custom banner. You can also click Explore free images to choose from available stock options. |
| Gift Card – Desktop Featured Image | This image is shown only on desktop devices (not on mobile). It highlights the gift card visually on larger screens. Click Select to upload your desktop-specific image or choose Explore free images. |
| Logo – Image | The logo represents your brand and may appear on the gift card, checkout page, or other sections. Click Select to upload your business logo or choose Explore free images to use available visuals. |
| Image Format | Supported image types: JPG, PNG, SVG. |
| Quality Recommendation | Use high-quality, correctly sized images for best results. |
| Editing Options | You can replace or remove uploaded images anytime. |
| Display Note | The Desktop Featured Image is visible only on desktop views, not on mobile or tablet. |