Theme settings apply to the whole store. In the theme editor, click the paintbrush icon (Theme settings) to open them.
Colors
Keld's colors come in background and text pairs. When you change a background, check that its text color still reads clearly on it.
Page
Setting
What it does
Page background
Sets the background of the page and light sections.
Page text
Applies to headings, body text and dark buttons on the page background.
Secondary text
Applies to descriptions, labels, SKUs and data on every light background.
Panels
Setting
What it does
Panel background
Applies to cards, forms, drawers, dialogs and light bands.
Panel text
Applies to text on panels.
Secondary panel background
Applies to hover rows, notices, code blocks and empty image slots.
Secondary panel text
Applies to text on secondary panels.
Borders
Applies to dividers and card borders.
Strong borders
Applies to input borders and outline buttons.
Accent
Setting
What it does
Accent background
Applies to primary buttons, the announcement bar and badges.
Text on accent
Applies to text on primary buttons and the announcement bar.
Accent hover background
Applies to primary buttons on hover.
Text on accent hover
Applies to text on primary buttons on hover.
Dark sections
Setting
What it does
Dark section background
Applies to the slideshow, image with hotspots, featured product, banners, toasts and footer.
Dark section text
Applies to text on dark sections.
Dark section secondary text
Applies to captions and secondary text on dark sections.
Dark input background
Applies to inputs, selects and hover states inside dark sections, and dark button hovers.
Dark input text
Applies to text on dark inputs and hover states.
Status and focus
Setting
What it does
Fitment: listed
Applies to "Listed for your vehicle" badges and the fitment panel.
Fitment: not listed
Applies to "Not listed" badges and warnings.
Focus ring
Applies to the keyboard focus outline. Keep the contrast high.
Typography
Setting
What it does
Heading font
Condensed font for headings, buttons and navigation.
Body font
Applies to paragraphs, product names and form text.
Label font
Applies to SKUs, labels, subheadings and spec tables.
All three use Shopify's font library, so they load from Shopify and need no extra setup.
Layout
Setting
What it does
Page width
Sets the maximum width of the content area (1000–1600px).
Corner radius
Applies to buttons, inputs, cards and images (0–12px). Keep it small for the theme's hard-edged look.
Motion
Setting
What it does
Reveal content on scroll
Fades sections in as they scroll into view (opacity and movement only). Turns off automatically for visitors who prefer reduced motion.
Header
Setting
What it does
Mobile logo position
Center or Left. Applies at 1100px and narrower, where the header shows the menu button, the logo, and the account, vehicle and cart icons.
The rest of the header (logo, menu, search, vehicle button, mega menus) is set in the Header section. See Sections › Header.
Fitment
Setting
What it does
Vehicle list
One vehicle per line as Make|Model|YearFrom|YearTo, the same format as the product metafield custom.fitment. Replace the default demo list with your own.
Show "Demo fitment" label
Shows dashed Demo tags across the store while your fitment, prices and image lists are still sample data. Turn off once your data is real.
With Show "Demo fitment" label on, these tags show:
Demo on the vehicle selector and the slideshow's vehicle form, fitment badges, the product fitment panel and the "Fitted on car" tab, the "Fits my vehicle" filter, collection and search page headings, and blog posts
Demo price on product and featured product prices, and Demo on product bundle totals
Demo images on the image gallery and Demo list on the installer locator
