> ## Documentation Index
> Fetch the complete documentation index at: https://docs.shopify.lightsout.agency/llms.txt
> Use this file to discover all available pages before exploring further.

# Set up store-wide Theme settings in Facet

> Learn what Facet's Theme settings control, how to open them in the Theme Customizer, and which settings groups to set up first in a new store.

Theme settings are the store-wide options in Facet. They set your logo, colors, fonts, page width, button and card shapes, swatches and motion once, and every page and section follows them. This page explains how to open Theme settings, lists each settings group, and suggests an order for setting up a new store.

## What these settings control

* Your logo, its width and the browser tab icon.
* The color schemes that sections and blocks pick from.
* The heading and body fonts.
* The maximum page width, the side margins and the gaps between grid items.
* The corner shape of buttons, form fields, cards and variant options.
* How product cards show their pictures and text.
* Which product options show as color swatches.
* Your social media links and the reveal motion as shoppers scroll.

## How to access

**1. Open the Theme Customizer**

In your Shopify admin, open **Online Store**, then **Themes**, and click **Customize** next to Facet.

**2. Open Theme settings**

Click the **Theme settings** icon in the left sidebar.

**3. Open a group**

Click a group, such as **Typography**, to expand it. Changes show in the preview right away. Click **Save** to publish them.

![The theme editor with the Theme settings panel open on the left, listing Logo, Social media, Typography, Layout, Grid, Buttons, Product cards, Variants, Corner radius, Animations, Colors, Custom CSS and Theme style.](https://mintcdn.com/lightsout/Svjpo54WQSiE2VRv/images/themes/facet/theme-settings/overview/overview-location.jpg?fit=max\&auto=format\&n=Svjpo54WQSiE2VRv\&q=85\&s=0749ef7ae350ceb50a169023118be8ab)

## Settings groups

> [card] [Logo](https://docs.shopify.lightsout.agency/themes/facet/theme-settings/logo.md)
>
> Upload your logo, set its width and add a favicon.

> [card] [Colors](https://docs.shopify.lightsout.agency/themes/facet/theme-settings/colors.md)
>
> Create the color schemes used by sections and blocks.

> [card] [Typography](https://docs.shopify.lightsout.agency/themes/facet/theme-settings/typography.md)
>
> Pick the heading font and the body font.

> [card] [Layout](https://docs.shopify.lightsout.agency/themes/facet/theme-settings/layout.md)
>
> Set the maximum page width and the side margins.

> [card] [Grid](https://docs.shopify.lightsout.agency/themes/facet/theme-settings/grid.md)
>
> Set the gaps between cards in product and content grids.

> [card] [Buttons](https://docs.shopify.lightsout.agency/themes/facet/theme-settings/buttons.md)
>
> Choose the corner style of every button.

> [card] [Product cards](https://docs.shopify.lightsout.agency/themes/facet/theme-settings/product-cards.md)
>
> Set the picture shape, text alignment and borders of product cards.

> [card] [Variants](https://docs.shopify.lightsout.agency/themes/facet/theme-settings/variants.md)
>
> Show color options as swatches and set the shape of option boxes.

> [card] [Corner radius](https://docs.shopify.lightsout.agency/themes/facet/theme-settings/corner-radius.md)
>
> Round the corners of form fields and cards.

> [card] [Social media](https://docs.shopify.lightsout.agency/themes/facet/theme-settings/social-media.md)
>
> Add the links behind your social media icons.

> [card] [Animations](https://docs.shopify.lightsout.agency/themes/facet/theme-settings/animations.md)
>
> Turn the reveal motion on scroll on or off.

## Recommended order

When you set up a new store, work through the groups in this order. Each step builds on the one before, so you rework less later.

1. **Logo**: upload your logo and favicon so every page carries your brand.
2. **Colors**: set up your color schemes before you pick schemes on sections.
3. **Typography**: choose fonts once your colors are in place.
4. **Layout** and **Grid**: set the page width, margins and grid gaps.
5. **Buttons** and **Corner radius**: match the shapes to your brand.
6. **Product cards** and **Variants**: check them on a collection page and a product page.
7. **Social media** and **Animations**: add your links and decide on scroll motion.

## Best practices

* **Change one group at a time.** Check the preview on a home, collection and product page before you move on.
* **Preview on a phone.** Use the phone view at the top of the Theme Customizer. Margins, gaps and font sizes change on small screens.
* **Duplicate the theme first.** Before large changes on a live store, duplicate Facet in **Online Store** > **Themes** and try them on the copy.

## Related guides

> [card] [Common settings](https://docs.shopify.lightsout.agency/themes/facet/common-settings.md)
>
> The color scheme, padding and width settings each section has.

> [card] [Theme blocks](https://docs.shopify.lightsout.agency/themes/facet/theme-blocks.md)
>
> Build sections from headings, text, buttons and other blocks.


This documentation is built and hosted on [Mintlify](https://mintlify.com), a developer documentation platform.