Hello There!
This is really cool, isn't it?
LOL! Enough of show-off...
I've made this real simple menu only with HTML and CSS3. You don't need any heavy jQuery libraries or JavaScript
to run any kind of effects used in this menu.
You can look out for the browser support.
<- Here


This is all you need to get this menu work.

<div class="neonize_me_nu_wrapper">  <!--Wrapper div is not required--> 
  <ul class="neonize_me_nu">
    <li><a href="#" class="current_tab"><span></span>HOME<span></span></a></li>
    <li><a href="#"><span></span>ABOUT US<span></span></a></li>
    <li><a href="#"><span></span>OUR WORK<span></span></a></li>
    <li><a href="#"><span></span>CONTACT<span></span></a></li>

/* Neonize Menu Starts*/
.neonize_me_nu_wrapper {	/* Use this only if you are using wrapper div */
	position: relative;
.neonize_me_nu {
	list-style-type: none;
	list-style-position: inside;
.neonize_me_nu li {
	display: inline-block;	/* Make the tabs inline */
	margin-right: 40px;	/* Leaving space between tabs */
.neonize_me_nu li a {
	color: #FFE900;
	font-family: 'digital-7regular';	/* I've packed these fonts
						in the download pack */
	font-size: 35px;
	opacity: .7;
	text-decoration: none;
	outline: 0;
	line-height: 40px;
.neonize_me_nu li a span  {
	display: block;
	height: 2px;
	width: 0;
	transition: width .5s;
	-moz-transition: width .5s;
	-webkit-transition: width .5s;
	-o-transition: width .5s;
	background-color: #fff;
	box-shadow: 0 0 10px #fff;
.neonize_me_nu li a span:nth-child(2)  {
	float: right;
.neonize_me_nu li a:hover span:nth-child(1), 
.neonize_me_nu li a:hover span:nth-child(2) {
	width: 100%;
.current_tab, .neonize_me_nu li a:hover {
	color: #ffffff !important;
	text-shadow: 0 0 10px #FFE900, 0 0 20px #FFE900, 0 0 30px #FFE900;
	opacity: 1 !important;


  • Change on hover effects.
  • Can use different color combinations for text, text-shadow as well as the on hover lines.
  • Set Transition speeds differently for each tab
I've already used NEONIZE ME-NU for this website but I would like to show you the demo here with another color.... mmmmmmm will be going with a Yellow one ;)....




Currently Disabled, contact me at firekillz[at]gmail[dot]com

Creative Commons License