Theme settings reference

Every global setting in the theme — 60 of them across 10 groups. Open these in the theme editor with the gear icon at the bottom of the sidebar. Everything here applies store-wide.

Configure these before you build pages. Every section inherits from them, so setting colors and type first turns a later change into one edit instead of forty.

Jump to a group:

Typography

Heading and body fonts come from Shopify’s font library. Bold, italic, and bold-italic variants load automatically, so emphasis inside a product description renders properly rather than being synthesized by the browser.

Fonts

Body fontFont
ID
type_primary_font
Default
work_sans_n4
Heading fontFont
ID
type_heading_font
Default
work_sans_n6
Heading font weightDropdown
ID
heading_font_weight
Default
Bold
  • Normalnormal
  • Boldbold
Body font sizeSlider
ID
body_font_scale
Default
100
Range
90% to 130%, in steps of 5%

Layout

One page-width value drives every section in the theme, along with the page margin and the corner style used by controls, cards, and contained media. Sections meant to be full-bleed ignore the width deliberately.

Page widthSlider
ID
page_width
Default
1600
Range
1200px to 1600px, in steps of 100px
Page marginSlider
ID
min_page_margin
Default
64
Range
10px to 100px, in steps of 1px
Corner styleDropdown

Sharp uses square corners. Soft rounds controls, cards, contained media, and section surfaces. Full-width media stays square. Custom corner radius settings take priority.

ID
corner_style
Default
Soft
  • Sharpsharp
  • Softsoft
Use custom control corner radiusCheckbox

Overrides Corner style for every bordered control and block: buttons, variant pills, quantity selectors, purchase options, dropdown triggers, badges, and blocks such as reassurance rows and sharing. Media thumbnails follow their own shape setting.

ID
use_custom_control_corner_radius
Default
Off
Control corner radiusSlider
ID
control_corner_radius
Default
22
Range
0px to 40px, in steps of 1px
Shown when
settings.use_custom_control_corner_radius
Media thumbnail shapeDropdown

Applies to product media thumbnails and takes priority over the corner radius settings. Cornered follows Corner style.

ID
media_thumbnail_shape
Default
Circle
  • Circlecircle
  • Corneredcornered

Social media

Links here populate the footer and any section that renders social icons. Leave a network blank to hide its icon rather than linking to an empty profile.

Social accounts

InstagramLink
ID
social_instagram_link
FacebookLink
ID
social_facebook_link
TikTokLink
ID
social_tiktok_link
PinterestLink
ID
social_pinterest_link
Twitter / XLink
ID
social_twitter_link
YouTubeLink
ID
social_youtube_link

Colors

Color schemes are assigned per section, not configured per section. Change a scheme here and every section using it updates at once. Every background is paired with a foreground so a scheme cannot be configured into an unreadable state.

color_schemescolor_scheme_group
ID
color_schemes

Brand

Logo, favicon, and the brand details reused across the footer and social sharing.

Favicon

FaviconImage
ID
favicon
LogoImage
ID
logo
Logo widthSlider
ID
logo_width
Default
120
Range
50px to 300px, in steps of 10px

Brand information

Brand imageImage
ID
brand_image
Brand image widthSlider
ID
brand_image_width
Default
150
Range
50px to 400px, in steps of 10px
Brand headlineRich text (inline)
ID
brand_headline
Brand descriptionRich text
ID
brand_description

Buttons

The shared button treatment. Accelerated checkout buttons are excluded — Shopify controls their appearance and a theme may not override it.

Choose one hover treatment for theme-authored action buttons.

Button hover effectDropdown

Applies across the theme. Navigation controls, quantity controls, disabled buttons, and Shopify-branded buttons keep their required interaction styles.

ID
button_hover_effect
Default
Shine sweep
  • Nonenone
  • Shine sweepshine
  • Slide upslide-up
  • Zoom inzoom-in
  • Zoom outzoom-out
  • Color refillcolor-refill

Product cards

These apply to every product card everywhere — collection grids, featured collection rails, search results, and recommendations. The largest single lever you have over how the catalog reads, so set them once here rather than per section.

Design the product card once here. Every section that shows products uses these settings.

Media

Image ratioDropdown
ID
card_image_ratio
Default
Portrait
  • Adapt to imageadapt
  • Portraitportrait
  • Squaresquare
  • Landscapelandscape
Image fitDropdown
ID
card_image_fit
Default
Fill
  • Fillcover
  • Fitcontain
Product card image behaviorDropdown

Choose a product-card-specific behavior. The global image hover effect still applies to displayed images.

ID
card_image_hover
Default
Show second image
  • Nonenone
  • Show second imageswap
  • Slideshowslider

Content

Variant option to showDropdown

Auto shows Color when available, otherwise the first product option. Size includes options such as Bottle size and Volume.

ID
card_variant_option
Default
Auto
  • Autoauto
  • Colorcolor
  • Sizesize
  • First optionfirst

Variant visibility

Variants are not shown in predictive search so shoppers can scan results quickly. Configure variants on product pages, quick view, collection grids, and search results instead.

Show in featured collectionsCheckbox
ID
card_show_variants_featured_collection
Default
On
Show in collection product gridCheckbox
ID
card_show_variants_collection_grid
Default
On
Show in search resultsCheckbox
ID
card_show_variants_search_results
Default
On
Text alignmentDropdown
ID
card_text_alignment
Default
Left
  • Leftleft
  • Centercenter
Text sizeDropdown
ID
card_text_size
Default
Medium
  • Smallsmall
  • Mediummedium
  • Largelarge
Show vendorCheckbox
ID
card_show_vendor
Default
Off
Show product ratingCheckbox

Displays star ratings from a connected product reviews app.

ID
card_show_rating
Default
Off

Badges

Badges follow a fixed priority: sold out, then sale, then custom, then new. Full product cards show up to two badges on tablet and desktop, and one on mobile. Compact cards show one at every size. A badge that does not fit is not lost — it appears once a higher-priority badge no longer applies.

Badge text caseDropdown
ID
card_badge_text_case
Default
Normal
  • Normalnormal
  • Capitalizecapitalize
Sale badgeDropdown
ID
card_sale_badge_style
Default
Sale label
  • Hidenone
  • Sale labeltext
  • Percentage offpercent
  • Amount savedamount
Show sold out badgeCheckbox

A sold out product shows this badge on its own, replacing every other badge.

ID
card_show_sold_out_badge
Default
On
Show new badgeCheckbox
ID
card_show_new_badge
Default
Off
New badge duration in daysSlider

Products published within this many days show a new badge.

ID
card_new_badge_days
Default
30
Range
7 to 90, in steps of 1
Shown when
settings.card_show_new_badge
Show custom product badgesCheckbox

Reads the optional custom.card_badge product metafield. Use a short, factual label such as Best seller or Exclusive. Leave it blank on a product to show no custom badge.

ID
card_show_custom_badge
Default
On
Sale badge color schemeColor scheme
ID
sale_badge_color_scheme
Default
scheme-2
Shown when
settings.card_sale_badge_style is not 'none'
Sold out badge color schemeColor scheme
ID
sold_out_badge_color_scheme
Default
scheme-4
Shown when
settings.card_show_sold_out_badge
New badge color schemeColor scheme
ID
new_badge_color_scheme
Default
scheme-1
Shown when
settings.card_show_new_badge
Custom badge color schemeColor scheme
ID
custom_badge_color_scheme
Default
scheme-1
Shown when
settings.card_show_custom_badge

Product variants

How variant options render across the theme, including swatches sourced from your variant option values.

Configure shared variant controls used in product cards, product sections, and quick view.

Picker styleDropdown

Auto keeps Shopify swatches visible and changes large or long text option groups to dropdowns.

ID
variant_picker_style
Default
Auto
  • Autoauto
  • Buttonsbuttons
  • Dropdownsdropdowns
Swatch displayDropdown

Applies when Shopify product data provides a color or image swatch.

ID
variant_swatch_display
Default
Swatch with label
Shown when
settings.variant_picker_style is not 'dropdowns'
  • Swatch with labelswatch_and_text
  • Swatch onlyswatch_only
  • Text onlytext_only
Swatch shapeDropdown
ID
card_swatch_shape
Default
Circle
Shown when
settings.variant_picker_style is not 'dropdowns' and settings.variant_swatch_display is 'swatch_only'
  • Circlecircle
  • Squaresquare
Chip sizeDropdown
ID
variant_chip_size
Default
Medium
Shown when
settings.variant_picker_style is not 'dropdowns'
  • Extra smallxs
  • Smallsmall
  • Mediummedium
  • Largelarge
Show selected valueCheckbox
ID
variant_show_selected_value
Default
On
Show sold-out and unavailable valuesCheckbox

Sold-out variants remain selectable so shoppers can view their media and availability. Combinations that do not exist remain disabled.

ID
variant_show_unavailable_values
Default
On

Cart and animations

Cart behavior, plus the scroll-reveal toggle for entrance animations.

Cart

Cart typeDropdown
ID
cart_type
Default
Drawer
  • Drawerdrawer
  • Pagepage

Animations

Reveal sections on scrollCheckbox
ID
animations_reveal_on_scroll
Default
On
Enable predictive searchCheckbox
ID
predictive_search_enabled
Default
On

Motion

Transition style and speed apply to every menu, tab, disclosure, drawer, and slideshow. All of it yields to a visitor’s reduced-motion preference automatically, so you do not need to configure anything for that.

Choose one gentle motion style for supported section reveals and slideshow scene changes.

Global motion styleDropdown
ID
motion_transition
Default
Soft fade
  • Soft fadefade
  • Rise into viewrise
  • Soft scalescale
  • No motionnone
Text reveal styleDropdown

Gives headings and supporting text their own entrance in sections that reveal on scroll.

ID
text_reveal_style
Default
Match section motion
  • Match section motionfollow
  • Soft riserise
  • Baseline sweepunmask
Interface animation speedDropdown

Applies to menus, disclosures, tabs, search panels, and routine review panels. Reduced-motion preferences override this setting.

ID
interface_animation_speed
Default
Slow
  • Standardstandard
  • Relaxedrelaxed
  • Slowslow
Image hover effectDropdown

Applies to storefront content images. Product-card image settings continue to take priority.

ID
image_hover_effect
Default
Gentle zoom
  • Nonenone
  • Gentle zoomgentle-zoom
  • Color lifteditorial-zoom
  • Zoom and brightenbrighten-zoom
Text link hover effectDropdown

Applies to standalone text links such as footer, breadcrumb, and product links. Header menus follow the menu hover style, and links inside body text keep their underline and deepen it on hover.

ID
text_hover_effect
Default
Underline sweep
  • Nonenone
  • Underline sweepunderline-sweep
  • Soft fadefade
  • Gentle liftlift

What is deliberately absent

There is no per-section spacing control, no per-section font size, and no per-section color picker. These were considered and left out. A theme that lets every section be tuned separately produces stores that look assembled rather than designed, and makes updates far harder to reason about. The global settings above are the intended path.