Theme settings
Theme settings hold everything shared across your store: logo, colors, typography, buttons, product cards, cart behavior, animations and more. Sections then choose from these, for example a color scheme or a typography style, so the store stays consistent.
Open them in the theme editor with the gear icon at the top of the left sidebar.
Open Theme settings
- In the theme editor, click the gear icon at the top of the left sidebar.
- Click a group to open its settings. Changes preview right away; click Save to keep them.
The groups
Theme settings
| Logo and favicon | Logo, mobile logo, logo for dark color schemes, widths and favicon. |
|---|---|
| Colors | Color schemes used by every section, and the status colors: sale, rating stars, in stock, low stock, error, focus ring. See Colors and color schemes. |
| Typography | Fonts and the four text styles (Display, Heading, Subheading, Body) that sections scale with Font scale. See Typography and font scale. |
| Layout | Page widths (Narrow, Standard, Wide), side padding, grid gaps, corner radius of boxed sections and drawers, and the section spacing scale. |
| Scrollbar | A custom scrollbar for the page and for panels such as drawers and menus. |
| Shape | Corner radius of media, cards and inputs, line thickness, and dividers between sections. |
| Buttons | Shape, size, hover effect, label animation, link hover and the add to cart button. |
| Product cards | Card style, image ratio and hover, title, spec line, highlights, swatches, quick add, rating and badges. See Product cards. |
| Product compare | The Compare button on product cards and the rows of the comparison table. See Product compare. |
| Variants & swatches | How variant options and swatches look, and which options show as color swatches. See Variant picker and swatches. |
| Cart | Drawer or page, order notes, free shipping bar and cart recommendations. See Cart drawer. |
| Pre-orders | Which products sell as pre-orders when out of stock. See Pre-orders. |
| Wholesale | Who sees prices and can order, and the company location picker for B2B. See Quick order and wholesale. |
| Search | Predictive search suggestions and popular links. |
| Animations | Entrances, heading reveals, parallax, smooth scrolling, page transitions, cursor labels, footer reveal, loading bar. See Animations and motion. |
| Overlays | Blur and darken the page behind drawers and pop-ups. |
| Privacy | A privacy note under sign-up forms, and waiting for cookie consent before remembering visitors. |
| Social media | Your social profile links, used by social icons in the footer, menu drawer and blocks. |
| Links | Open links to other sites in a new tab. |
| Custom CSS | Shopify's field for your own CSS. |