Freebie: Sleek Navigation

While working on “TechBase”:, I spent a lot of time crafting a nice sleek nav for the site, all in CSS3. However after finishing it, I realized it looked sorely out of place with the more simplistic design I had started implementing, so I canned it. But I put so much work into it, it would be a shame to just throw it away, so I decided to give it to you guys.

It’s all CSS3, with no images at all. I made comments on some parts of the CSS, but for the most part, I’m distributing it as-is, meaning cross-browser compatibility has not been checked whatsoever. Use it for whatever you want, no restrictions. Linking and credit aren’t required, but appreciated.

Here’s “the demo”:, you can copy and paste the code straight from the demo page.

Posted in Design, Freebie, General, Web
  • Sean

    Good job Dan, much thanks, even though I probably wont use it, some CSS3 elements in there gave me some new knowledge.

  • Dan

    No problem, man. Even for educational purposes, it’s all good. I used box-shadow, gradients, text-shadow, border-radius, and background-clip, so it’s definitely a useful little CSS3 resource.

  • Sean

    Yeah, I’ve never used box-shadow or background-clip, and I didn’t know how to use gradients so it’s a good reference for me to come back to later.


  • Tim

    Makes me sad to use Opera, now. So many coding techniques lost on lack of support. :(

  • Dan

    Why are you using Opera? It’s a pretty awful browser in terms of appearance, features, and speed.