Every setting under Online Store > Themes > Customize > Theme settings, generated from the theme code.
Logo and favicon
Logo image
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Logo | image_picker | Shown in the header, footer and mobile menu. Leave empty to show your store name as a text logo. | ||
| Mobile logo | image_picker | Optional. Falls back to the logo on small screens. | ||
| Logo width on desktop | range | 40 to 400 px, step 4 | 120 px | |
| Logo width on mobile | range | 32 to 240 px, step 4 | 88 px |
Text logo
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Text logo size on desktop | range | 18 to 64 px, step 2 | 30 px | |
| Text logo size on mobile | range | 14 to 44 px, step 2 | 24 px |
Favicon
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Favicon | image_picker | Square image, at least 32 x 32 px. 180 x 180 px works best for phone home screens. |
Typography
Fonts
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Type scale | select | Compact, Regular, Large | Regular | Sets the size of headings and lead text across the theme. |
| Heading line height | range | 90 to 130 %, step 5 | 100 % | |
| Body font | font_picker | instrument_sans_n4 | ||
| Heading font | font_picker | cormorant_n5 | ||
| Highlight font | font_picker | cormorant_i5 |
Headings
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Font size scale | range | 70 to 150 %, step 1 | 100 % | |
| Mobile font size scale | range | 70 to 150 %, step 1 | 100 % | |
| Font weight | select | Inherit, Light, Regular, Medium, Semi bold, Bold, Extra bold, Black | Inherit | |
| Letter spacing | range | -10 to 10 %, step 1 | -1 % |
Body
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Font size scale | range | 70 to 150 %, step 1 | 100 % | |
| Mobile font size scale | range | 70 to 150 %, step 1 | 100 % | |
| Font weight | select | Inherit, Light, Regular, Medium, Semi bold, Bold, Extra bold, Black | Inherit | |
| Letter spacing | range | -10 to 10 %, step 1 | 0 % |
Navigation
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Navigation font | radio | Body, Heading | Heading | |
| Font size scale | range | 70 to 150 %, step 1 | 100 % | |
| Mobile font size scale | range | 70 to 150 %, step 1 | 100 % | |
| Font weight | select | Inherit, Light, Regular, Medium, Semi bold, Bold, Extra bold, Black | Inherit | |
| Letter spacing | range | -10 to 10 %, step 1 | 0 % | |
| Text transform | select | As typed, Uppercase, Lowercase | As typed |
Layout
Layout direction
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Enable RTL layout | checkbox | Off | ||
| RTL languages | textarea | he,ar | Comma-separated language codes. RTL languages automatically switch to RTL layout based on the store's active language. | |
| Page width | select | Narrow, Wide, Full | Narrow | |
| Page margin | range | 10 to 100 px, step 1 | 20 px | |
| Section spacing | range | 50 to 150 %, step 10 | 100 % | Scales the vertical padding of every section. |
Colors
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| color_schemes | color_scheme_group | |||
| Background | color | #FAF6F0 | ||
| Foreground | color | #2E241B |
Badges
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| New badge background | color | #546633 | ||
| New badge text | color | #FFFFFF | ||
| Hot badge background | color | #2e241b | ||
| Hot badge text | color | #FFFFFF | ||
| Popular badge background | color | #e9e4da | ||
| Popular badge text | color | #2e241b | ||
| Sale badge background | color | #A02500 | ||
| Sale badge text | color | #FFFFFF | ||
| Sold out badge background | color | #B7B7B7 | ||
| Sold out badge text | color | #2e241b |
Other colors
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Input corner radius | range | 0 to 10 px, step 1 | 0 px |
Recommended products
Recommended products
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Recommended products on product page | range | 1 to 8, step 1 | 4 |
Icons
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Icon stroke weight | range | 1 to 2, step 0.1 | 1.2 | |
| Icon ends | select | Round, Square | Round |
Buttons and corners
Primary button
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Style | select | Solid, Outline, Glass, Soft tint, Text link | Solid | Used for main actions such as Add to cart and Checkout. |
Secondary button
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Style | select | Solid, Outline, Glass, Soft tint, Text link | Outline | Used for supporting actions such as Update cart. |
Glass effect
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Glass blur | range | 4 to 32 px, step 2 | 14 px | |
| Glass tint | range | 5 to 60 %, step 5 | 15 % | How much of the button color tints the glass. |
All buttons
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Shape | select | Square, Slightly rounded, Rounded, Pill | Square | |
| Size | select | Compact, Regular, Large | Regular | |
| Border width | range | 0 to 4 px, step 1 | 1 px | |
| Hover effect | select | Swap colors, Lift and swap colors, None | Swap colors | |
| Letter spacing | select | Normal, Wide | Normal | |
| Text | select | As typed, Uppercase | As typed |
Corners
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Image corner radius | range | 0 to 32 px, step 2 | 0 px |
Images
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Image shape | select | Automatic, each section decides, Adapt to each image, Portrait (4:5), Square, Landscape (3:2), Wide (16:9) | Automatic, each section decides | Frame shape for section pictures. Each section can override it. |
| Image display | select | Automatic, each section decides, Cropped to fill the frame, Whole image, never cropped | Automatic, each section decides | Choose how pictures fill their frame. |
| Border width | range | 0 to 8 px, step 1 | 0 px | |
| Border color | color | #2e241b | Shown when settings.media_border_width > 0. |
|
| Add a background behind images | checkbox | Off | Visible around images that are not cropped. | |
| Background color | color | #f3ebe2 | Shown when settings.media_background_on. |
|
| Image credit line | text | Shown in the footer. For example: Artwork images courtesy National Gallery of Art, Washington, CC0. |
Image loading
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| While pictures load | select | Fade in when ready, Shimmer, Custom image, Nothing | Fade in when ready | |
| Loading image | image_picker | Shown in the middle of each picture while it loads, such as your logo or a small mark. 300 x 300px recommended. A transparent .png works best. Shown when settings.image_loading_style == 'placeholder'. |
||
| Loading image size | range | 10 to 60 %, step 5 | 25 % | Shown when settings.image_loading_style == 'placeholder'. |
Product cards
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Image ratio | select | Adapt to image, Portrait (4:5), Tall portrait (3:4), Poster (2:3), Square, Landscape (3:2), Wide (16:9), Custom | Adapt to image | Paintings come in many sizes. Adapt keeps each work's own shape; the others give a tidy, even grid. |
| Image fit | select | Show the whole image, Fill the frame | Show the whole image | Show the whole painting or fill the frame. Shown when settings.card_image_ratio != 'adapt'. |
| Custom height | range | 50 to 200 %, step 5 | 125 % | Height as a percentage of the width: 100 is square, 125 is 4:5 portrait, 75 is 4:3 landscape. Shown when settings.card_image_ratio == 'custom'. |
| Image position | select | Automatic, Top, Center, Bottom | Automatic | Automatic follows the focal point set on each image in the Shopify admin. Bottom lines works up on one baseline, like a hanging line. Shown when settings.card_image_ratio != 'adapt'. |
| Mat around image | range | 0 to 40 px, step 2 | 0 px | An even border in the surface color, like a mat in a frame. Works best with Show the whole image. |
| Title lines | select | No limit, 1 line, 2 lines, 3 lines | No limit | Shortens long titles with an ellipsis and keeps prices in line across a row. |
| Show artist | checkbox | On | ||
| Show dimensions | checkbox | On | ||
| Hover effect | select | None, Show second image, Lift | Show second image | |
| Show sale and sold out badges | checkbox | On |
Card buttons
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Show quick add to cart button | checkbox | On | ||
| Works with several sizes or options | select | Add the first available option, Open the product page | Add the first available option | A product with options adds its first available option, or the button opens the product page so the visitor can choose. Shown when settings.card_show_quick_add. |
| Button style | select | Icon, Text | Icon | Shown when settings.card_show_quick_add. |
| Animate the button while adding | checkbox | On | Shows progress and a confirmation once the item is in the cart. Visitors who prefer reduced motion see a calmer version. Shown when settings.card_show_quick_add. |
|
| Show quick view button | checkbox | On | A button appears over the picture when a visitor hovers over a card. It opens the work in a pop-up. |
Card box
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Card style | select | Plain, Outlined, Filled | Plain | |
| Border width | range | 1 to 6 px, step 1 | 1 px | Shown when settings.card_style == 'outlined'. |
| Border color | color | #2e241b | Shown when settings.card_style == 'outlined'. |
|
| Background | color | #f3ebe2 | Shown when settings.card_style == 'filled'. |
|
| Corner radius | range | 0 to 32 px, step 2 | 0 px | Shown when settings.card_style != 'plain'. |
| Space inside the card | range | 0 to 32 px, step 2 | 12 px | Shown when settings.card_style != 'plain'. |
Scrolling
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Smooth scrolling | checkbox | On | Links that jump to a part of a page glide there. Off for visitors who prefer reduced motion. | |
| Scroll bar | select | Browser default, Custom colors, Thin with custom colors, Hidden | Custom colors | |
| Scroll bar handle | color | #8a7d6b | Shown when settings.scrollbar_style == 'custom' or settings.scrollbar_style == 'thin'. |
|
| Scroll bar track | color | #f3ebe2 | Shown when settings.scrollbar_style == 'custom' or settings.scrollbar_style == 'thin'. |
Motion
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Enable animations | checkbox | On | ||
| Animate sections as you scroll | checkbox | On | Quiet reveals: pictures are uncovered, headings rise and the salon hang floats. Off for visitors who prefer reduced motion. | |
| Animation intensity | select | Subtle, Normal | Subtle |
Cart
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| Cart type | select | Page, Drawer | Drawer | The drawer slides in from the side when customers add to cart or select the cart icon. |
| After adding to cart | select | Open the cart drawer, Stay on the page and update the cart icon | Open the cart drawer | Shown when settings.cart_type == 'drawer'. |
| Cart color scheme | color_scheme | scheme-9 | Colors of the cart drawer. Edit the schemes under Colors. Shown when settings.cart_type == 'drawer'. |
|
| Cart footer color scheme | color_scheme | scheme-1 | Colors of the subtotal and checkout area. Shown when settings.cart_type == 'drawer'. |
Social media
| Setting | Type | Options | Default | Notes |
|---|---|---|---|---|
| url | ||||
| url | ||||
| X | url | |||
| url | ||||
| TikTok | url | |||
| YouTube | url |