Skip to content

We're game if you are!

Get in touch to find out more.


Dark Transparent Header

To make the header transparent by default turning to the primary colour on sticky simply set/remove the following classes on the following elements:

  • 1 body : add the class .header-ontop .
  • 2 .header : add the classes .header-transparent , .header-dark , .sticky-header-dark and .sticky-bg-primary .
  • 3 You may need to add a top margin to the elements in the #highlighted region so they don't show under the header.
  • 4 Also ensure the background image underneath is dark colour so the navbar links can be seen, use the overlay utilities to help here.
  • 5 That's it!

See demos of other colours here: header transparent white and header transparent dark.

Awesome Features

99.9% Uptime Free Upgrades Fully Responsive Bug Free

Theme Colours

Green Red Blue Purple Pink Orange Lime Blue-dark Red-dark Brown Cyan-dark Yellow Slate Olive Teal Green-bright

Cookies are NOT enabled so colour selection is not persistent.

Back to main homepage

Back to intro page