The hamburger icon, or navicon if you want to get all technical, is a relatively recent introduction to web design interfaces. The biggest issue with these icons is that they typically don’t offer any sort of interactivity – it starts as a stack of 3 lines and it ends up as a stack of 3 lines. Not that pretty or intuitive.
Transformicons offers a new take on this interface element – adding a pretty cool animated effect that uses CSS and SVG. There’s a few other icons thrown in for good measure too.
Icon examples borrowed from Dennis Gaebel at Gray Ghose Visuals, the creator of Transformicons
The Transformicons website also offers a really great interface to build the code for the icons you want to use, splitting the output into CSS, HTML and JS.
The code is licensed under MIT so you can use it however and wherever you want.
Check it out here…
