Design Trend: Sticky Headers and Navigation Menus

This page may contain links from our sponsors. Here’s how we make money.

Today we’ll take a look at a trend that you’ve probably noticed, websites using sticky or fixed position headers. When a visitor scrolls down the header will remain in view at the top of the browser rather than moving out of view at the top of the screen.

The sticky header can help to make it easier for visitors to navigate through a site as they can quickly access the navigation menu rather than having to scroll back to the top of the page.

UNLIMITED DOWNLOADS: 50+ Million Add-Ons & Design Assets

Envato Elements Ad - Unlimited Downloads of Creative Assets
placeholderplaceholder

Here we will showcase 25 different websites that are making use of sticky headers. The screenshots show the headers as they appear after scrolling down. Visit any of the example sites to see them in action.

Websites with Sticky Headers

Pixel2HTML

Pixel2HTML

Kerem Suer

Kerem Suer

Tweed Barbers

Tweed Barbers

Sweez

Sweez

Loft City Church

Loft City Church

Carrera

Carrera

Nosh

Nosh

Jumpbox Design

Jumpbox Design

With

With

I Shot Him

I Shot Him

Seed Spot

Seed Spot

Grain and Mortar

Grain and Mortar

Manos

Manos

Daniel Filler

Daniel Filler

Heathlife

Heathlife

Nic Brunson

Nic Brunson

Norther Pixels

Norther Pixels

Switch

Switch

Milk & Pixels

Milk & Pixels

Teamgeek

Teamgeek

Grooveshark

Grooveshark

Tony Headrick

Tony Headrick

Studio NEC

Studio NEC
Get the Free Resources Bundle