Accent color Used for the accent line in the header and footer and for the color of the accent icons inside the accent boxes (the icons boxes that appear everywhere there's an input, variant selectors, form, cart, etc). Primary color Used for buttons, inputs, and accent bars (the bars that appear behind variant inputs, forms, header bars). Buttons text color Used for the text inside buttons and inputs (when customizing make sure you pick a color with enough contrast to the primary color). Text color Used for all the text on the page beside buttons and inputs. Page background


Headings font Used for the text inside sections' title bars, and headings in general. Body font Used for text everywhere else.

Link style

Make links bold Makes all the links on the page bold, including the navigation and menus. Make links uppercase Makes all the links on the page uppercase. Show link underline Controls when the underline appears on links, either is always visible or only shown when a link is being hovered on.


Enable header shadow Enables the shadow at the bottom of the header. Enable footer shadow Enables the shadow at the top of the footer. Enable shadows in sections Enables shadows for content containers, images, banners and title bars throughout the theme's sections. Enable shadows in buttons Enables shadows in buttons, both when active and inactive. Enable shadows in inputs Enables the inner shadows for inputs (newsletter, account pages, comments).

Buttons and inputs

Buttons style Controls how the corners of the buttons are styled throughout the theme. Inputs style Controls how the corners of the inputs are styled throughout the theme. Make buttons uppercase Controls weather or not the text inside buttons is capitalized or normal.

Search Behavior

Enable search Controls whether or not the search button appears in the header. Enable search suggestions If search suggestions are enabled then a modal is used and users can search from any page without the need to go to the search page, when search suggestions are disabled the users are taken directly to the search page when clicking the button. Suggestions per type Controls how many suggestions of each type is shown, for example: If 5 is chosen, the users will see a maximum of 5 results from each type, product, page, etc (if those search suggestions are enabled). Show products in search suggestions Controls whether or not products will appear in the search suggestions. Show collections in search suggestions Controls whether or not collections will appear in the search suggestions. Show articles in search suggestions Controls whether or not articles will appear in the search suggestions. Show pages in search suggestions Controls whether or not pages will appear in the search suggestions.


Image ratio Controls how product images appear, you can force them all to be in portrait, landscape or square, this way the grid will be even, or you can choose auto and the images will retain their aspect ratio, but the grid will not be even (choose what best suits the design you're going for and that best fits your images). Show vendor Controls whether or not the vendor (Brand) appears on products Enable filtering Enables or disables the filter functionality and modal on collections pages and the search page that lets users better search for products depending on the options you provide (size, color, price, custom filters, etc). Add storefront filtering (Shopify) Enable sorting Enables or disables the sorting functionality on collection pages and the search page. Filter modal visibility Choose whether or not the filters are visible when the page loads or users need to click the filter button first (The filters are always hidden on mobile). Products grid gap Controls the distance between rows and columns on product grids. Products border radius Controls how rounded the corners of product cards are. Distance between image and product info Controls the distance between the product image and the product description on product cards. Disable shadows Disables the shadows on product cards.


Enable cart note If cart note is enabled customers will be able to leave extra details for their order. Show vendor Shows vendor(Brand) on products inside the cart.

Social media

Here you can add all of your social media links that are used to display a link in the footer's social media block.

Accent boxes

Accent box style Controls the appearance of the accent boxes (the icons boxes that appear everywhere there's an input, variant selectors, form, cart, etc).


This is the little icon that appears in your browsers tab along with the title of the page you're on.

Color swatches

How to setup In order to turn a product option into a color swatch you just need to add the color value separated by a hyphen to the color list. Like so Blue-#2e82ff. You can have as many color swatches as you want, just make sure to separate each color value with a comma, like so pink-#ff1f66,blue-#388bff,green-#65db02,orange-#f28a29,white-#d9d9d9. Capitalization does not matter, so if you have a product with a option Blue, you can add the color in lowercase blue-#388bff and vice-versa.
Enable color swatches When color swatches are enabled, color swatch button will appear on the product page for the options that you added a color to, when disabled normal button with just the name of the color will be used. Color swatches style The style of the color swatch button.


Universal settings

These are settings that you will find on almost every section. Show header bar Displays a bar at the top of the section that holds a title, in case you need to give more context tot the section or simply give a title to the section. Heading The text that appears inside the title bar. Center header bar text Centers the text inside the header bar. Maximum width How wide the section can be on bigger screens, adjust depending on the feel you're going for, you can have all the sections be the same width or make some section wider (Every section has equal width on mobile).

Blog posts

Section settings Blog Choose the blog that you want to display articles from. Show tags Displays tags on the blog articles, if it has any. Show author Displays the name of the author on the blog articles. Show date Displays the date at which the article was posted. Articles limit Controls how many articles from the blog you want to display in that section.

Collection list

Section settings make images square Forces all images in the displayed collection to have the same ratio, when disabled the images keep their aspect ratio. Section blocks Collection Displays the selected collection.

Custom Liquid

Used to insert custom liquid code into the page. Liquid reference (Shopify)

Email signup

Used for collecting customer email addresses. Section blocks. Heading Used as a title inside the section. Text Used to add text into the section. Email form Displays the email form used for collecting customer addresses.

Featured collection

Section settings Collection Select a collection from which to display products. Show collection banner Makes the first card to display the collection info and image, so users can navigate to that collection. Make collection banner image same ratio as products Makes the image card that displays the collection to be the same ratio as the product images (the value selected inside the grid settings for product image aspect ratio). Products limit How many products to display from the selected collection.

Featured product

Used to display a product along with it's options so that the users can quickly add it to their cart. Section blocks. Product info Displays the product title, price and description. Variant picker Displays the different options of the product (if any) so the users can select different variants. Quantity selectors Displays the quantity inputs for the product. Buy buttons Displays the add to cart button and optionally the dynamic checkout buttons. Dynamic checkout buttons (Shopify) Pickup availability Displays information regarding the pickup availability of local stores (if any). Local pickup for online orders

Image with text

Displays one or two images with optional links and description. Section settings Image aspect In case there are two images choose whether or not you want them to be the same size, or let them keep their aspect. Make descriptions boxes the same height In case one of the images descriptions has longer text, you can choose to make both containers the same size. Section Blocks Image Render a image and optionally a link to redirect customers to a page and a description (Can be used to redirect customers to a product, article, collection, etc).

Rich text

Used for writing paragraphs. Section Blocks Title Text Paragraph of text that can include links, bold and italic text.


Renders one image with an optional link at a time. Section settings Image height Sets how tall you want the slides to be, adjust depending on your images. Autoplay Controls whether or not the sides changes the images automatically. Change slides every Controls how often the slides change. Transition effect Controls the type of effect slides get when they change. Transition effect duration Controls how long the transition effect lasts when the slides change. Section Blocks Image An image of the slider with an optional link.


Section settings Video url (from local files) Use this field to link to a file from your shopify admin. Uploading and managing files Show controls Shows pause/play and full screen buttons (Depending on the type of video and how you use this section, you may want to give the customers the ability to go back and forth and pause the video, or to just use it decoratively). Autoplay Controls if the video will play by itself without user interaction (if you have controls disabled, you need to enable autoplay, otherwise the customers won't be able to play the vide). Video url (external) Use this to link to a video from Youtube or Vimeo.