It's summer (here in the northern hemisphere) and we're celebrating 101 issues of CSS animation! What's on the menu? Menus! Check out loads of inventive and interesting menu ideas in the inspiration section.

While you're here, do check out my free (pay what you want) 4-week email course all about getting started with CSS animation!

♥️

Donovan at CSSAnimation.rocks

CSS Animation 101 - Learn how to add animation to web pages using CSS — cssanimation.rocks

Looking for a way to get started on your CSS animation journey? Check out this course. It's currently *pay what you want* (even $0) 😅

Inspiration

isometric menu — codepen.io

Click this beautiful isometric menu to see the options expand out in 3D

Expanding and Collapsing Hamburger Menu

This is crazy, the items in the menu collapse in to become the burger!

Playful Hover Menu — codepen.io

Can you crack the code and make the menu options display on this totally-not-user-friendly but cool menu?

Google Loaders Redesign — codepen.io

Some nifty page loading animations made using HTML and CSS

CodePen Challenge: Menu — codepen.io

Tweenmax animations bring this menu to life!

RPG Maker Menu — codepen.io

Old-skool inspired animated menu

Cube Assembly — codepen.io

Lovely subtle example of animation created using HTML and CSS blocks!

Birdy — codepen.io

This cute animated bird is made with just HTML and CSS ✨ 

Bonus!

Heraclos, and the quest he never ever asked for — heraclosgame.com

Check out this amazing WebGL project from Gobelins, the school of image.