Skip to content

Header height

The ideal height for a header typically ranges between 70-120 pixels on desktop, ensuring enough space for clear navigation and branding without taking up too much screen real estate.


If your main navigation bar is around 50-70 pixels, a utility bar (top bar) of 20-40 pixels works well, ensuring it remains subtle but functional. It’s common for the utility bar to be roughly half the height of the main navigation bar, but this is not a strict rule. The key is maintaining a balanced visual hierarchy where the utility bar is clearly secondary to the main navigation.

Scroll To Top