Theme settings
Theme Settings
These settings apply across your entire store and can be found in Theme Settings at the bottom of the Theme Editor sidebar.
Brand
| Setting | Type | Default | Description |
|---|---|---|---|
| Logo | Image | — | Shown in the header. Without a logo, the shop name shows instead, unless Show shop name when no logo is off. |
| Logo width | Slider | 140 | Width of the logo in the header, in pixels. Height follows the image's proportions. · Min: 40 · Max: 320 · Step: 10 · Unit: t:sections.shared.units.px |
| Show shop name when no logo | Toggle (on/off) | On | Only used when no logo is set. When off, the header shows no shop name at all (it is still read out to screen readers). |
| Favicon | Image | — | The small icon in browser tabs and bookmarks. Use a square image; it is shown at 32 × 32 pixels. |
Appearance
ℹ️ Brand colors. The color roles below use these colors by default. Change a brand color here to update every role that uses it, or set a role below to its own color.
| Setting | Type | Default | Description |
|---|---|---|---|
| Color palette | Color palette | paper #F7F7F3, surface #FFFFFF, text #17191B, ink #121416, signal #E63946, dark_paper #151719, dark_surface #1C1F21, dark_text #F1F1ED, dark_ink #0D0F10 | — |
| Presentation mode | Dropdown | system | The default for new visitors. Once a visitor picks a mode in the header, their choice is remembered on their device and overrides this. To preview a change here, use a private browser window. · Options: system – System, light – Light, dark – Dark |
Light mode colors
| Setting | Type | Default | Description |
|---|---|---|---|
| Background | Color | {{ settings.colors.paper }} | Page background. |
| Card background | Color | {{ settings.colors.surface }} | Cards, panels, drawers and dialogs. |
| Text | Color | {{ settings.colors.text }} | Headings and body text. Muted text, borders and tints are mixed from Text and Background. |
| Accent | Color | {{ settings.colors.signal }} | Highlights and links, and the one signal moment on each screen. |
| Text on accent | Color | {{ settings.colors.surface }} | Text on filled sale badges (Product display > Sale badge style: Filled). Keep a contrast of at least 4.5:1 with Accent. |
| Contrast band | Color | {{ settings.colors.ink }} | Dark bands, messages and primary buttons. |
| Text on contrast band | Color | {{ settings.colors.surface }} | Text and icons on Contrast band and over images. Keep a contrast of at least 4.5:1. |
| Selected | Color | {{ settings.colors.ink }} | Selected sizes, filters and options. |
| Text on selected | Color | {{ settings.colors.surface }} | Text on Selected. Keep a contrast of at least 4.5:1. |
Dark mode colors
| Setting | Type | Default | Description |
|---|---|---|---|
| Background | Color | {{ settings.colors.dark_paper }} | Page background. |
| Card background | Color | {{ settings.colors.dark_surface }} | Cards, panels, drawers and dialogs. |
| Text | Color | {{ settings.colors.dark_text }} | Headings and body text. Primary buttons in dark mode are filled with this color, with Contrast band as their text. |
| Accent | Color | {{ settings.colors.signal }} | Highlights and links, and the one signal moment on each screen. |
| Text on accent | Color | {{ settings.colors.dark_ink }} | Text on filled sale badges (Product display > Sale badge style: Filled). Keep a contrast of at least 4.5:1 with Accent. |
| Contrast band | Color | {{ settings.colors.dark_ink }} | Dark bands and messages. |
| Text on contrast band | Color | {{ settings.colors.surface }} | Text and icons on Contrast band and over images. Keep a contrast of at least 4.5:1. |
| Selected | Color | {{ settings.colors.dark_text }} | Selected sizes, filters and options. |
| Text on selected | Color | {{ settings.colors.dark_ink }} | Text on Selected. Keep a contrast of at least 4.5:1. |
Header layout
| Setting | Type | Default | Description |
|---|---|---|---|
| Sticky header | Toggle (on/off) | On | When enabled, the header remains pinned to the top as the page scrolls. Disable to reclaim vertical space when using a large main menu. |
| Close buttons | Dropdown | text | How drawers, dialogs and messages show Close. Match the header's Utility style for a consistent look. Media and the announcement bar always use an icon. · Options: text – Text, icon – Icon, icon_text – Icon and text |
| Default variant selector style | Dropdown | buttons | Used by quick add and product card options, and by the product page unless its Variant selector style setting picks a different style. · Options: buttons – Buttons, dropdown – Dropdowns |
| Product card quick actions | Dropdown | buttons | Icons shows compact icon buttons on product cards instead of text buttons. The action name is still read out to screen readers. · Options: buttons – Buttons, icons – Icons |
| Product image fit | Dropdown | cover | Show whole image keeps square or cutout product images uncropped inside the frame. · Options: cover – Fill frame, contain – Show whole image |
| Show product highlights | Toggle (on/off) | On | Shows up to three product facts or a highlight statement on standard-size product cards. Facts come from the product's highlight metafields or its Shopify category attributes; compact cards never show them. |
| Show product role label | Toggle (on/off) | On | Shows a short label above the product title on cards. It uses the product's role: tag (see Product tag labels), or the product type if there is no such tag. |
| Product highlights label | Text | Highlights | Label on the product card that opens its highlights, when Show product highlights is on. |
Typography
| Setting | Type | Default | Description |
|---|---|---|---|
| Body font | Font | manrope_n4 | — |
| Heading font | Font | barlow_condensed_n5 | — |
| Eyebrow font | Font | ibm_plex_mono_n5 | Font for the small labels above headings and for product codes. If none is chosen, the heading font is used. |
Cart and checkout
| Setting | Type | Default | Description |
|---|---|---|---|
| Cart name | Text | Bag | What your store calls the cart, for example Cart, Bag or Basket. Used in headings, buttons and messages. |
| Cart name in sentences | Text | bag | The same word as it reads mid-sentence, for example bag in “Add to bag”. |
| Show accelerated checkout buttons on the cart page | Toggle (on/off) | On | Shows express payment buttons such as Shop Pay or PayPal in the cart drawer and on the cart page. Which buttons appear depends on your payment settings. |
| Enable free shipping progress bar | Toggle (on/off) | Off | Shows how much more a shopper needs to spend for free shipping, in the cart drawer, cart page and announcement bar. This only displays a message; set up the actual free shipping rate in Shopify shipping settings. |
| Free shipping threshold | Slider | 50 | In your store currency: 100 means 100 of it. Used by the cart and the announcement bar, and shown only to shoppers paying in that currency. · Min: 0 · Max: 500 · Step: 5 |
Product display
| Setting | Type | Default | Description |
|---|---|---|---|
| Tax label | Dropdown | auto | Adds an "incl. tax" or "excl. tax" note to prices on the product page, product cards and cart. Automatic shows "incl. tax" beside the product page price when your prices include tax, no note on product cards, and follows your tax settings in the cart. · Options: auto – Automatic, incl – Show incl. tax, excl – Show excl. tax, none – Hide tax label |
| Low stock threshold | Slider | 5 | Shows a Low stock badge on the product page when a tracked variant that can't be oversold has this many units or fewer left. · Min: 1 · Max: 50 |
| Product tag labels | Multi-line text | — | Labels for product tags that start with code: or role:, one per line as key: label, for example style-01: Style 01 · Classic. Translate this setting in Translate & Adapt so cards read in each language. A tag with no line shows as written. |
| Sale badge style | Dropdown | outline | Outline: Accent border and text. Filled: Accent background with the Text on accent color (Colors). Applies on product pages and product cards. · Options: outline – Outline, filled – Filled |
| Show product codes | Toggle (on/off) | On | Shows each product’s short code on cards, quick add, cart lines and the product page. Codes come from code: product tags and the Product tag labels setting; the product page uses its Product code setting. |
| Show model details | Toggle (on/off) | On | Shows the Model line from the product page's Fit note block, for example "186 cm, wears M", under the fit note and in the size guide. |
Policies
| Setting | Type | Default | Description |
|---|---|---|---|
| Policy page note | Text | — | Short line shown above every store policy, for example to mark a demonstration store. Leave blank to hide it. |
Social media
| Setting | Type | Default | Description |
|---|---|---|---|
| Instagram URL | URL / Link | — | Links the matching icon in the footer, and on the password page when it shows social links. Leave blank to hide that icon. |
| Pinterest URL | URL / Link | — | Links the matching icon in the footer, and on the password page when it shows social links. Leave blank to hide that icon. |
| Facebook URL | URL / Link | — | Links the matching icon in the footer, and on the password page when it shows social links. Leave blank to hide that icon. |
| X (Twitter) URL | URL / Link | — | Links the matching icon in the footer, and on the password page when it shows social links. Leave blank to hide that icon. |
| YouTube URL | URL / Link | — | Links the matching icon in the footer, and on the password page when it shows social links. Leave blank to hide that icon. |
| TikTok URL | URL / Link | — | Links the matching icon in the footer, and on the password page when it shows social links. Leave blank to hide that icon. |
| LinkedIn URL | URL / Link | — | Links the matching icon in the footer, and on the password page when it shows social links. Leave blank to hide that icon. |
| Snapchat URL | URL / Link | — | Links the matching icon in the footer, and on the password page when it shows social links. Leave blank to hide that icon. |
| Bluesky URL | URL / Link | — | Links the matching icon in the footer, and on the password page when it shows social links. Leave blank to hide that icon. |
Product page sharing
| Setting | Type | Default | Description |
|---|---|---|---|
| Enable PDP social share row | Toggle (on/off) | On | Shows share icons under the add to cart button on product pages. Choose the networks below; nothing shows if none are selected. |
| Toggle (on/off) | On | Instagram has no web share link, so this icon opens Instagram with the page address attached rather than a ready-made post. | |
| Toggle (on/off) | On | — | |
| Toggle (on/off) | On | — | |
| X | Toggle (on/off) | Off | — |
| YouTube | Toggle (on/off) | Off | YouTube has no web share link, so this icon opens your YouTube profile (from Social media) or the YouTube home page instead of sharing the page. |
| TikTok | Toggle (on/off) | Off | TikTok has no web share link, so this icon opens your TikTok profile (from Social media) or the TikTok home page instead of sharing the page. |
| Toggle (on/off) | Off | — | |
| Snapchat | Toggle (on/off) | Off | Snapchat has no web share link, so this icon opens your Snapchat profile (from Social media) or the Snapchat home page instead of sharing the page. |
| Bluesky | Toggle (on/off) | Off | — |
| Copy link | Toggle (on/off) | On | Adds a button that copies the page address so shoppers can paste it anywhere. |
Blog article sharing
| Setting | Type | Default | Description |
|---|---|---|---|
| Enable blog social share row | Toggle (on/off) | On | Shows share icons on blog articles. Choose the networks below; nothing shows if none are selected. |
| Toggle (on/off) | On | Instagram has no web share link, so this icon opens Instagram with the page address attached rather than a ready-made post. | |
| Toggle (on/off) | On | — | |
| Toggle (on/off) | On | — | |
| X | Toggle (on/off) | Off | — |
| YouTube | Toggle (on/off) | Off | YouTube has no web share link, so this icon opens your YouTube profile (from Social media) or the YouTube home page instead of sharing the page. |
| TikTok | Toggle (on/off) | Off | TikTok has no web share link, so this icon opens your TikTok profile (from Social media) or the TikTok home page instead of sharing the page. |
| Toggle (on/off) | Off | — | |
| Snapchat | Toggle (on/off) | Off | Snapchat has no web share link, so this icon opens your Snapchat profile (from Social media) or the Snapchat home page instead of sharing the page. |
| Bluesky | Toggle (on/off) | Off | — |
| Copy link | Toggle (on/off) | On | Adds a button that copies the page address so shoppers can paste it anywhere. |