Customize
Theme settings
Global settings apply to the whole store. Open them in the theme editor with the Theme settings icon.
The defaults listed on this page are those of the Duskline preset. The Gilt and Rally presets start with other values for some settings. See Presets.
Logo
- Logo
- Your logo image, shown in the header. Without a logo, the header shows your store name.
- Logo width
- Width of the logo in the header.
- Inverse logo
- Shown when the header is transparent over a hero image. Use a light version of your logo. See transparent header.
- Favicon
- The icon in the browser tab. Displayed at 32 x 32px.
Colors
Colors are organized in color schemes. Every section chooses one scheme in its Color scheme setting. Select a scheme to edit its colors, or add a new scheme. Each preset includes six schemes. Those of the Duskline preset are described in Getting started.
- Background
- The section background.
- Background gradient
- Gradient replaces solid background color.
- Text
- Body text, links and icons.
- Headings
- Heading text.
- Secondary text
- Smaller supporting text, such as captions, vendor names and notes.
- Borders
- Lines, dividers and outlines.
- Accent
- Eyebrow text above headings, link hover color, sale prices, form error messages and the free shipping progress bar.
Buttons
- Primary button background
- Fill color of primary buttons, such as Add to cart and Check out.
- Primary button label
- Text color on primary buttons.
- Secondary button label and border
- Secondary buttons have a transparent fill; this color is used for their text and outline.
Inputs
- Input background
- Background of text fields, dropdowns and other form fields.
- Input text
- Text inside form fields.
Typography
Headings
- Font
- The heading font, from Shopify's font library.
- Font size scale
- Scales every heading size up or down.
- Letter case
- Default keeps your text as typed. Uppercase shows headings in capital letters.
- Letter spacing
- The space between the letters of headings. In hundredths of the font size. Negative values tighten headings, positive values open them up.
Body text
- Font
- The font for body text, buttons, menus and forms.
- Font size scale
- Scales body text up or down.
Layout
- Page width
- The maximum width of page content on large screens.
- Space between template sections
- Adds space between sections in a template. At 0, sections sit directly against each other and only their own padding separates them.
Buttons and inputs
- Button corner radius
- Rounds the corners of buttons. The highest value gives fully rounded pill buttons.
- Input corner radius
- Rounds the corners of text fields and dropdowns.
- Image corner radius
- Rounds the corners of images and media.
Product cards
Product cards appear in collections, search results, the Featured collection section and Product recommendations. How product cards work.
- Image ratio
- Shape of card images: Adapt to image, Portrait (4:5), Square or Tall (2:3).
- Show second image on hover
- On desktop, hovering a card shows the product's second image. On touch screens, shoppers can swipe through up to five product images. When this is off, cards show one image.
- Show color swatches
- Shows swatches under the price for the option named in Swatch option names. Selecting a swatch changes the card's image and link.
- Swatch option names
- Separate option names with a comma. Swatches show for the first matching option. Matching ignores upper and lower case.
- Enable quick add
- Adds a quick add button to cards. Products with one variant are added in one tap; products with options open a small dialog to choose them.
- Show vendor
- Shows the product vendor above the title.
- Text alignment
- Left or Center.
Badges
- Position on cards
- Top left, Top right or Bottom left of the card image.
- Sale badge color scheme
- Color scheme for sale badges.
- Sold out badge color scheme
- Color scheme for sold out badges.
- Sale badge text
- Sale shows the word "Sale". Percentage off shows the discount, calculated from the compare-at price.
Swatches
Swatch colors and images come from your product option values. You can set a color or image for each option value in your Shopify admin. Learn more about swatches.
- Shape
- Circle or Square.
- Size
- Small or Medium. Applies to swatches on product cards. Product pages always use medium swatches.
When an option value has no swatch color or image set in Shopify, Duskline guesses a color from common color words in the value's name, such as "sage", "navy" or "terracotta". If no color word matches, the swatch is neutral: an outlined shape with a diagonal line. Why are some swatches empty?
Cart
- Cart type
- Drawer opens the cart in a panel from the side of the screen. Page takes shoppers to the cart page.
- Enable order notes
- Lets customers add a note to their order in the cart.
Free shipping progress
- Free shipping threshold
- Amount in your store's currency. Use 0 to hide the progress bar. Make sure it matches your shipping rates.
- Show confetti when free shipping is reached
- Plays a short confetti burst once when the cart reaches the threshold. Not played for visitors who prefer reduced motion.
Complementary products
- Show complementary products
- Shows product suggestions in the cart drawer and on the cart page. Uses complementary products from the Search and Discovery app, or related products when none are set.
- Heading
- Heading above the suggestions.
Details are on the Cart page.
Delivery estimate
Used by the Delivery estimate block on product pages and by the delivery estimate in the cart. Order cutoff times use your store's time zone. How the estimate is calculated.
- Minimum business days
- The earliest delivery, in business days after the order ships.
- Maximum business days
- The latest delivery, in business days after the order ships. If it is lower than the minimum, the minimum is used.
- Order cutoff hour
- Orders placed after this hour ship the next business day. Uses the 24-hour clock in your store's time zone.
- Skip weekends
- When on, Saturdays and Sundays are not counted as business days.
- Holidays
- Days you do not ship or deliver. One date per line, YYYY-MM-DD, for example
2026-12-25.
Search
- Enable search suggestions
- Shows products, collections, pages, blog posts and suggested searches in the search dialog as shoppers type.
- Show product vendor
- Shows the vendor on products in search suggestions.
- Show product price
- Shows the price on products in search suggestions.
Social media
Under Social media accounts, enter the full address of each profile, for example https://instagram.com/yourstore. Icons appear in the footer's Social media icons block and in the mobile menu, when Show social media icons is on in the header. Leave a field empty to hide that icon.
Available accounts: Facebook, Instagram, TikTok, Pinterest, X, YouTube, Snapchat, Tumblr, Vimeo, Threads and LinkedIn. Your X address is also used for link previews when your pages are shared on X.
Animations
- Reveal sections on scroll
- Sections fade in gently as they scroll into view. Visitors who have asked their device to reduce motion do not see the animation.
- Hover effect
- Affects cards and buttons. None leaves them still. Lift raises buttons slightly and gently enlarges card images when shoppers hover them.
Currency format
Cart and checkout prices always show currency codes. Example: $1.00 USD.
- Show currency codes
- Also shows the currency code with prices across the rest of the store, such as on product pages and collections.