New This website is new, your feedback will help us to improve it.

Header

Overview

This is a header which doesn’t support navigation. The BAS Logo should be used in headers to reinforce the BAS brand.

Headers should only be used where the Navbar's component is unsuitable, for example within external systems.

Variants

Default header

To look right, scale the logo in the header so that its height is one of these sizes:

Image Absolute Image Height (Px)
32
64
128
32
64
128

The .bsk-brand-logo class sets image with to 290px to help with this.

<header class="text-neutral-50 bsk-bg-blue py-10">
<div class="container mx-auto px-6 fhd:px-16">
  <div class="flex justify-between w-full h-6">
      <a href="/"><img class="bsk-brand-logo" src="/images/bas-logo/bas-logo-inverse-transparent-64.png"></a>
  </div>
</div>
</header>