How do I change the header background color in Squarespace?

Squarespace 7.1 uses the .header-theme CSS variable system for header colors, but you can override the background directly on the header element. The main selector is #header.

If your header is set to transparent in the site styles, you may need to add !important to override the inline styles Squarespace applies. You can also use rgba values for semi-transparent backgrounds.

#header {
  background-color: #1a1a2e !important;
}

/* For a semi-transparent header */
#header.header--menu-open {
  background-color: rgba(26, 26, 46, 0.95) !important;
}