Back to all components

Header

The Header element in Mition is used to display important information at the top of your page, typically for branding, navigation, or highlighting key content.

It’s a versatile element that helps set the tone and structure of your site.

Key Features
  1. Title/Logo: Display your site’s title, logo, or brand identity prominently.
  2. Navigation Links: Include links to different sections of your site (e.g., Home, About, Contact).
  3. Call to Action: Add buttons or links encouraging users to take immediate action (e.g., "Sign Up," "Contact Us").


Examples
  1. Site Branding: Place your logo and company name at the top of every page for consistent branding.
  2. Main Navigation: Use the header to include links to the most important pages, ensuring users can easily navigate the site.

Example Header

Here is an example header
Variations

Different colour styles can be utilised here. Click here for more details.

Custom layout tools can be found here.

Example Lavender Header

Here is an example Lavender coloured header. You can change the colours and size of the Header text.

Smiley.png

Example Orange Header

Here is an example orange coloured header with an image inserted by adding the source text into the custom HTML area.

Smiley.png

Example Aqua Header

Here is an example size 6, aqua coloured header showing that you can have headers for different sized areas of your webpage
Next

Hero

This original hero has the ability to have a single large background image, but you have to add text into the custom HTML text area to see the background image OR use a foreground image, which can have words / text or a feature image. Y...

Read More