...
Create an image that shows your logo on a coloured background, with the proportions 3:1. Place the logo in the middle, leaving coloured space above and below it. Make the picture as high-quality as you can, with a maximum of 2 MB.
Go to the Theme editor > Main Appearance and make the following settings:
Background: upload your image
Image options: full
Position image: centered
Banner height: the same height as your background image, or half of it.
In Theme editor > Header, set the background colour to transparent. In Theme editor > Start page, toggle on Fill background. Site Homes, choose one of the two bottom options (Alternate or Wide Alternate)
Save the theme and go to the home page of the site you applied the theme to.
Edit the layout, and:
Make sure the section is set to Transparent.
Add a Search Highlight or Navigation Highlight module
Set the module’s height to match the height of your background image. In our example, this is 500 pixels.
...