Freebie: 5 Beautiful Bootstrap Headers

Freebie: 5 Beautiful Bootstrap Headers

In this post we present to you a collection of five templates for headers and navigation bars. We’ve created them using Bootstrap 3, following all the best practices for working with the framework. The templates are ready to use and easy to incorporate in any existing design.

The Headers

To help you save time, we’ve created five different designs, that you can choose from. They are simple, fully responsive and work great on mobile devices.

Blue Header

Blue Header

Our headers can be used as part of an existing design, or can be customized easily if you have experience with Bootstrap. For some of the templates, we’ve used fonts from Google Fonts, the built-in Glyphicons set, and images from Pexels.com.

Header Nightsky

Header Nightsky

How to use

To use any of the templates from the demo, follow these simple steps:

  1. Grab the zip archive from the Download button near the top of the page and extract it.
  2. Open the .html file for the template you want, copy the code inside and paste it in your project.
  3. The styles are located in separate CSS files for each design. You can find them in the /assets/css/ folder.

Free for Commercial Use

You have all rights to customize and use these templates. They are 100% free and can be implemented in both personal and commercial projects, no attribution required (our license page). Enjoy!

Presenting Bootstrap Studio

a revolutionary tool that developers and designers use to create
beautiful interfaces using the Bootstrap Framework.

Learn more
Web Browser Frame DevKit Box Mouse Cursor
by Georgi Georgiev

Georgi is a computer science student who loves web development, writing code and crafting interfaces.

1Share this post
2Read one more article
3Get your free book
Book Cover
jQuery Trickshots

Tutorialzine's advanced jQuery techniques book.

Download

One Comment

  1. Konrad says:

    Very nice :)

Add Comment

Add a Reply

HTML is escaped automatically. Surround code blocks with <pre></pre> for readability.
Perks:   **bold**   __italics__   [some text](http://example.com) for links