Inspiration for Menu Hover Effects
In Playground by Manoela Ilic
Some menu link hover effects for your inspiration. Powered by CSS and JavaScript for individual letter animations.
In Playground by Manoela Ilic
Some menu link hover effects for your inspiration. Powered by CSS and JavaScript for individual letter animations.
In Playground by Manoela Ilic
Some ideas for menu styles and effects that employ the line as a creative design element. This is an open collection; contributions are welcome!
In Blueprints by Manoela Ilic
A simple multi-level menu with delayed item animations and an optional breadcrumb navigation and back button.
In Tutorials by Luis Goncalves
A tutorial on how to implement an animated menu icon based on the Dribbble shot by Tamas Kojo using SVG and Segment, a JavaScript library for drawing and animating SVG paths.
In Playground by Manoela Ilic
Some inspiration for off-canvas menu effects and styles using CSS transitions and SVG path animations.
In Tutorials by Manoela Ilic
A tutorial on how to create a off-canvas icon navigation with an animated border effect. The menu effect is inspired by CreativeDash’s bounce menu for mobile apps.
In Playground by Manoela Ilic
An experimental push menu with multi-level functionality that allows endless nesting of navigation elements.
In Tutorials by Manoela Ilic
A tutorial on how to re-create the slide out sidebar menu that can be seen on the Google Nexus 7 website.
In Blueprints by Manoela Ilic
A simple tooltip menu where the submenu will either appear above or below the main menu, depending on available space.
In Blueprints by Manoela Ilic
A horizontal slide out menu with a grid-like thumbnail layout for the submenu. With media query examples for smaller devices.
In Tutorials by Stéphanie Walter
A responsive, touch-friendly and Retina-ready menu with three layouts for different browser sizes.
In Tutorials by Manoela Ilic
A tutorial on how to recreate the effect of YouTube’s little left side menu. The idea is to slide a little menu icon to the right side while revealing some menu item list beneath.
In Playground by Manoela Ilic
A responsive multi-level menu that shows its submenus in their own context, allowing for a space-saving presentation and usage.
In Blueprints by Manoela Ilic
Fixed menus that will slide out from the sides of the page and in case of the right and left side optionally move the body.
In Blueprints by Manoela Ilic
A fixed vertical icon menu that adjusts its size for smaller screens.
In Blueprints by Manoela Ilic
A responsive horizontal drop-down menu inspired by the Microsoft.com menu.
In Tutorials by Manoela Ilic
A responsive 3D menu concept for a restaurant website. The idea is to show the menu as a folded flyer and unfold it in order to show the menu items.
In Tutorials by Manoela Ilic
Quick tip on how to spice up your menu with CSS3: add an image to every menu item and slide it out on hover.