# How do I change the page background?

Setting a background color on every section works, but if you want one consistent color across the whole page without touching each section individually, add it once with Custom CSS instead.

## Add a custom background color

1. Open the template you want to set a background color.
2. In the page editor, open the **Custom codes** modal.<br/>![](https://docs-assets.foxecom.app/faqs-and-troubleshooting/5c7617d5-7496-4906-876f-f6795e10565c.png)
3. Paste the code below, swapping in your hex color.
4. Save your changes.

```css
body { background-color: #your-hex-color; }
```

![](https://docs-assets.foxecom.app/faqs-and-troubleshooting/d312a7fd-9f4c-4046-aedb-0c0d272d8c0b.png)

<Hint type="info" title=" Transparent sections aren't blank">
  A section with no background color set isn't invisible — once published, it takes on your Shopify theme's own page background color. The custom CSS above overrides that with your chosen color instead.

  Any section with its own solid background color still covers this wherever it sits — the body color only shows through on sections left transparent, or in gaps between sections.
</Hint>

## Want it on every page instead of just one?

The Custom codes modal above only applies to the page you're editing — repeat it on each page, or add the same CSS once under **Theme settings** > **Custom codes** to apply it site-wide across every Foxify page.&#x20;

Open Theme settings from the **•••** icon in the left sidebar, or press ⌘, (Mac) / Ctrl+, (Windows). Learn more: [Configure your theme settings](https://docs.foxecom.com/foxify-app/foxstudio/page-customization/theme-settings)