Note: While our most popular guides have been translated into Spanish, some guides are only available in English.
Changing background colors

You can change your site's background colors to help set a tone, make certain areas pop, or reinforce your brand.

Tip: Some templates also support background images.

Before you begin

Background areas

Background color options vary by template:

  • All templates - You can set the color of the main content area.
  • Some templates - You can set separate colors for the header, footer, and space around your content.

For example, in the Brine template, you can set a few background areas:

In the Avenue template, the main content area is called the canvas, which includes the header and footer. Everything outside the canvas has a separate color: the site background.

Tip: In some templates, the canvas area is called the page or content area.

Change the background color

When setting your background color, the best place to start is the main content area. In general, you can follow these steps:

  1. From the Home Menu, click Design, then Style Editor.
  2. Look for tweaks called BackgroundPage Background, Site, Page Color, Content Background Color, or similar titles. Every color tweak has a circle next to its label. This circle shows the current color for that element.
  3. Experiment with the color tweak. If it only changes one part of the background, you can change other background areas with different tweaks. Try clicking on each background area to see related tweaks.

For more help, visit Changing colors or the Style Editor tweaks guide for your template.

Background colors by template

Here's a list of each template's customizable background areas. Templates are grouped by family.

Adirondack
  • Site
  • Canvas
  • Navigation bars
  • Header 
Avenue
  • Site
  • Canvas
Aviator, Aubrey
  • Site
  • Canvas
Bedford, Anya, Bryant, Hayden
  • Site
  • Header
  • Prefooter
  • Footer
Brine, Aria, Basil, Blend, Burke, Cacao, Clay, Ethan, Fairfield, Feed, Foster, Greenwich, Hatch, Heights, Hunter, Hyde, Impact, Jaunt, Juke, Keene, Kin, Maple, Margot, Marta, Mentor, Mercer, Miller, Mojave, Moksha, Motto, Nueva, Pedro, Polaris, Pursuit, Rally, Rover, Royce, Sofia, Sonny, Sonora, Stella, Thorne, Vow, Wav, West
  • Site
  • Canvas
  • Border
  • Top header
  • Footer
  • Mobile bars
Farro, Haute
  • Site
  • Border
  • Header
  • Footer
  • Mobile bar
Five
  • Site
  • Canvas
  • Canvas border
  • Header
Flatiron
  • Site
  • Header/footer
Forte
  • Site
Galapagos
  • Site
  • Header
Ishimoto
  • Site
  • Page border
Momentum
  • Site
  • Canvas
  • Footer navigation
Montauk, Julia, Kent, Om
  • Site
  • Canvas
Native
  • Site
Pacific, Charlotte, Fulton, Horizon, Naomi
  • Site
  • Canvas
  • Header
  • Index alternating sections
  • Prefooter
  • Footer
Skye, Foundry, Indigo, Ready, Tudor
  • Site
Supply
  • Site
  • Header/sidebar navigation
Tremont, Camino, Carson, Henson

 

  • Site
  • Navigation overlay
  • Index

 

Wells
  • Site
Wexley
  • Site
  • Mobile nav
York, Artesia, Flores, Harris, Jasper, Jones, Lange, Shibori
  • Site
  • Banner

Next steps

Was this article helpful?
6 out of 38 found this helpful
Changing background colors