© 2014 by Roman P

Item Title
Item Link
New Item +
Edit Menu Items
Generate HTML CSS code for design
Build
Export
AbCd AbCd AbCd AbCd AbCd AbCd
AbCd AbCd AbCd AbCd AbCd AbCd
Text Fonts
Normal
Small-Caps
Font Variant
Normal
Bold
Font Weight
Font
Color
Letter Spacing
px
Font Size
px
Line Height
px
Font Properties
Shadow
Color
Shadow Offset X
px
Shadow Offset Y
px
Shadow Blur
px
Text Shadow Decoration
Back
Color
Item Width
px
Item Height
px
Items Property
Border
Color
Border Width
px
Border Radius
px
Border Decoration
Remove background image Click on image to set as background
Select Item Image
Shadow
Color
Shadow Offset X
px
Shadow Offset Y
px
Shadow Blur
px
Shadow Spread
px
Shadow Parameters
Back
Color
Remove background image Click on image to set as main background
Select Main Image
Shadow
Color
Shadow Offset X
px
Shadow Offset Y
px
Shadow Blur
px
Shadow Spread
px
Shadow Parameters
Level Border Radius
px
Addition Decoration
Main Menu Height
px
Main Margin Top
px
Main Margin Left
px
First Level Decoration
Text
Hover
Back
Hover
Text
Active
Back
Active

About Dark Menu Template

This is a dark menu example that use only two colors: black and white, in addition it contains image from your free library that is set as background for all sub levels to demonstrate an image implementation. Replace this image with any other to see the visual change between the menu look. If you don't like the image it could always be removed clicking no image icon.

Dynamic creation

Constantly updating this generator, we trying to give more and more options to enable menu restyling but with great effort and thought so the menu creation would be intuitive and comfortable. It's taking a lot of time and hard work and thinking so please be tolerant to this site even if you report a bug it may be fixed fast but it takes time and bugs are fixed by FIFO principles!

"Deal" with menu links

While you giving a menu item link URL always take in consideration that it going to be on your server site so for best practice and fast uploading don't try to enter a full URL, instead use a relative one. Try keeping short and strong path names- this is best SEO practise both not just for you but even for site and any search engines.

The working Panel

The working space build from multiple tabs that divined in major fours groups. The main; where you give your menu titles and links and control of your project. The text decoration; where you can decorate each level items text. The foreground; witch contains all decoration to the item itself. The background; where you can decorate level appearance. The active items; where you can decorated mouse hover ad selected item effects. Besides all essential decoration like color or image are done in the "Double Tabbed" panel witch drops down to extend more comfortable way and enable in parallel preserve of working space.

Why go "Dark" grid

Actually all of our menus are build the same way and stands upon standard examples to create an menu : HTML | MDN UL Examples, this is a skeleton grids to the menu. All other decorations of the menu itself are done by the editor, so it can be achieved any color combination size and decoration for all menus that are present here, just leave a room for your imagination.

HTML Grid Layout

If you need to create an fluid grid layout design that will appear in multiple screen sizes such as desktops, laptops and tablets this tool is designed for such purpose. Any layout grid you create or use a pre build one always contain original columns rows sizes with page width consideration, showing scroll bars upon page overflow. The hight for each DIV block is self expandable witch prevents content overlap.

Pattern Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Ornament Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Texture Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Custom Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Other Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background
Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background Click on image to set as background
Update your web browser and enable JavaScript for full "HTML Menu Generator" support Update your web browser and enable JavaScript for full "HTML Menu Generator" support
Drag marker set brightness Update your web browser and enable JavaScript for full "HTML Menu Generator" support
Drag marker to set opacity Update your web browser and enable JavaScript for full "HTML Menu Generator" support
R G B Opacity
Submit
Apply
Cancel
Menu Explorer
Second Level Menu Appearance

Third Level Menu Appearance

About Menu Layout
Exit- Close
  • ID as selector
  • Class as selector
  • Plain HTML
  • Wordpress
  • Download ZIP file

To build a HTML CSS website layout for your menu
Visit : www.Blended-HTML.com