table of contents
are you looking for a talent to recruit?

discover how we help you!

Customizing the background color of your Squarespace site can significantly enhance its aesthetic appeal and align it with your brand identity. Whether you want to change the background color site-wide or for specific sections, this guide will walk you through the necessary steps.

Changing the Background Color Site-Wide

  1. Access the Style Editor:
    • Log in to your Squarespace account and navigate to the website you want to edit.
    • Click on the Design menu in the left sidebar, then select Site Styles.
  2. Edit Color Palette:
    • In the Site Styles panel, look for the Colors option. Click on it to open the color palette editor.
    • Here, you can choose from the available color palettes or customize your own. To change the background color, click on the relevant section in the palette and select your desired color.
  3. Save Changes:
  • After selecting your colors, make sure to click Save to apply the changes to your site.

For a detailed guide, you can refer to the Squarespace Help Center.

Changing the Background Color for Specific Pages or Sections

If you want to change the background color for a specific page or section, you may need to use custom code, especially if you are using Squarespace 7.0.

For Squarespace 7.0:

  1. Open Page Settings:
    • Go to the page you want to edit and click on the gear icon (⚙️) to open the Page Settings.
  2. Add Custom Code:
    • Navigate to the Advanced tab within the Page Settings.
    • In the Page Header Code Injection section, paste the following code snippet:
      <style>
        .Main {
          background-color: #YOURCOLORHEX !important;
        }
      </style>
      
    • Replace #YOURCOLORHEX with the hex code of your desired color.
  3. Save Changes:
  • Click Save to apply the changes.

For Squarespace 7.1:

  1. Edit Section Background:
    • Click on the section you want to customize.
    • In the section editor, look for the Background option.
    • Here, you can select a color, image, or video as the background.
  2. Save Changes:
    • After making your adjustments, ensure you click Save to keep your changes.

Conclusion

Changing the background color on Squarespace is a straightforward process that can dramatically affect the look and feel of your website. Whether you’re updating the site-wide background or customizing specific pages, these steps will help you achieve the perfect aesthetic for your brand. For more detailed instructions, you can visit the Squarespace Forum.