Keep header text and logo readable on a cover image

Choose whether the copy and the logo over your cover photo read light or dark.

What it's for#

When the header carries a cover image, its title, text and logo sit on the photo. Their color follows the overlay painted over the image, not the photo itself, so a bright picture with a light overlay can leave white text unreadable. “Text and logo on the image” lets you decide.

How to#

1 On step 3 · Design, select the header (the “Hero” section). Once it has a cover image, “Text and logo on the image” sits below the overlay settings, set to “Auto”.

2 Pick “Light” for white copy and logo, or “Dark” for dark ones. The canvas follows right away.

3 Pick “Auto” again to let the overlay decide.

Good to know#

• The setting moves the copy and the logo together, so they never disagree on the same image: your brand’s logo for dark backgrounds with light copy, the other one with dark copy.

• Auto follows the overlay you set: over an accent overlay the copy reads against your accent color, and over a background-colored overlay, or none, it follows the page.

• Changing the overlay (“Overlay color” and “Overlay”) is often enough on its own: try it before forcing Light or Dark.

• The setting only exists while the header has a cover image; without one, the header reads on the page background.