• August 23, 2013
  • 0 Comments

Here we go again with another round up of menu designs to give you inspiration for your website or portfolio. This time we are showcasing some great, single level bar menus. If your website doesn't have a lot of pages, a bar menu like these will work perfectly and keep your users focused on the page content. Most menu bar navigations have 1 level and a larger font size. Since these type of navigations are optimized for smaller websites, the designs can be much bigger and more extravagant.

Take a look at the menu Bar navigation we have found and let us know what you think. If you have an suggestions or have a menu design you think we should include, let us know in the comments.

  1. 1

    Responsive Flat Menu Bar

    This menu bar is not only simple and functional, but also packs a responsive punch. Ready for any situation this menu will work on all devices from your desktop to your iPhone.

    http://cssmenumaker.com/menu/simple-responsive-menu
  2. 2

    Responsive Textured Menu Bar

    This menu bar uses a really cool textured pattern that give the design a little bit of depth. The menu is also fully responsive, which means it needs a little jQuery magic to work on all devices.

    http://cssmenumaker.com/menu/responsive-menu-bar
  3. 3

    Indented Blue Menu Bar

    This simple menu bar employs a linear gradient on the background to give the menu depth. Active items are highlighted by an inner box shadow that give the menu element and indented look.

    http://cssmenumaker.com/menu/indented-horizontal-menu
  4. 4

    Tabbed Graphite Blue

    This blue, tabbed menu is a great addition to any website that needs a tab bar navigation. If you have a simply designed site, use this larger bar navigation to give you site some style.

    http://cssmenumaker.com/menu/tabbed-menu
  5. 5

    Graphite Green Bar Menu

    Graphite Bar Menu

    A little bit of a biased opinion on this bar menu since it happens to be one of our own. Either way head on over and grab the source code for this menu and integrate into your site.

    http://cssmenumaker.com/menu/rough-algae-horizontal-menu
  6. 6

    Bubble Wrapped Menu Bar

    This menu bar uses pure CSS to achieve its design.

    http://cssmenumaker.com/menu/bubble-wrap-horizontal
  7. 7

    Lifted Bars

    Bar Navigation

    This little horizontal menu is called Chunky and comes to us from Pixden. Whats unique about this navigation is that the thick bottom border make it jump off the page.

    http://www.uiparade.com/portfolio/chunky-web-menu/
  8. 8

    Wooden Nav Bar

    Bar Navigation

    A wood grained background is the defining characteristic of this menu. Perfect for use with a minimal design that needs the navigation bar to be the focal point.

    http://dribbble.com/shots/243719-Freebie-Wooden-menu
  9. 9

    Indented Bar Navigation

    Bar Navigation

    The active state for this bar menu lets you easily know whats up and where you are at on a site. Used with a dark background the indented shadowing help define this bar menu.

    http://www.uiparade.com/portfolio/inspired-navigation/
  10. 10

    Bold Web App Bar

    Bold Web App Bar

    This bold menu bar would be the perfect addition to your website. The simple bar design with the larger, graphite container command the users attention.

    http://www.uiparade.com/portfolio/web-app-menu/