Skip to content


Switch branches/tags

Name already in use

A tag already exists with the provided branch name. Many Git commands accept both tag and branch names, so creating this branch may cause unexpected behavior. Are you sure you want to create this branch?

Latest commit


Git stats


Failed to load latest commit information.
Latest commit message
Commit time


Featherweight, Responsive, CSS Only Navigation bar


Try out all the options at the demo page!

Getting started

Get it with NPM:

npm install luxbar

Or with bower:

bower install luxbar

Or use the CDN:

<link rel="stylesheet" href="">

Then head over to the demo page to generate your customized HTML code or use the one below as a base and see the docs for options. (Demo page is highly recommended for the newcomers)

<div class="luxbar luxbar-static">
    <input type="checkbox" id="luxbar-checkbox" class="luxbar-checkbox">
    <div class="luxbar-menu luxbar-menu-right luxbar-menu-dark">
        <ul class="luxbar-navigation">
            <li class="luxbar-header">
                <a class="luxbar-brand" href="#">Brand</a>
                <label class="luxbar-hamburger luxbar-hamburger-doublespin"
                        for="luxbar-checkbox"> <span></span> </label>
            <li class="luxbar-item active"><a href="#">Home</a></li>
            <li class="luxbar-item dropdown"><a href="#">Users</a>
                    <li class="luxbar-item" ><a href="#">Max</a></li>
                    <li class="luxbar-item" ><a href="#">Edgar</a></li>
                    <li class="luxbar-item" ><a href="#">John</a></li>


  • If you have any questions maybe it's already answered in the faq
  • If not then post your question to the issue page
  • If you found a bug or have a feature request post it there as well
  • You can message me directly at
  • Licensed under the MIT license