Capitan's masthead builder allow you to easily design pages with heading areas containing headline text, descriptions buttons and background images.

This page uses the masthead type "Full Width (cropped to content)" and the configuration shown below:

How the image scales up and down

If you have selected an image for the background of the masthead, the selected image will be scaled to fit to the edges of the browser window. The height of the masthead will be based on the content in the masthead. The exact behaviour of this component can be adjusted in your CSS file.

If no image is selected

By default a colour from your brand colour palette will be used as the background of the component.

Masthead Menu & Button Style

You can insert 2 manual buttons through the interface, auto buttons based on page content, or auto navigation.

Choose from Capitan's 3 default button styles. Remember, these will use your brand palette as standard, but can be further tailored to fit your brand.

Darkmode

Choosing darkmode will let Capitan know that the image or background colour are dark, so it should make your text white.

Media Filter

Capitan comes with some default overlay filters for your images, these are translucent gradients incorporating your brand colour palette and can be useful for strengthening brand aesthetic if you use images from many sources. The filter itself can be adjusted in your CSS file.

Transparent Nav

Make the main navigation bar transparent so you can see the masthead media behind it