Codevember is here and there is so much going on in web animation. Checkout how to create an amazing fullscreen hover loop effect, and how to add personality to a web page using CSS animations.

♥️

Donovan at CSSAnimation.rocks

Articles

Fullscreen Hover Loop Effect — tympanus.net

A fullscreen loop effect that shows a fast preview of images when hovering a special menu item.

From Ordinary to Extraordinary with CSS Animations — medium.marqeta.com

A tutorial on how CSS animations using SVG can bring a sign-on portal to life, step by step

Featured

Level Up your CSS animation skills? No! Don't buy yet! — courses.cssanimation.rocks

Thinking of buying my wonderful, friendly and helpful course on adding CSS animation to your web projects? Think again! I have two big updates this week. Stay tuned on Twitter for the updates (one has to to with Black Friday, hint hint)

Inspiration

Carrot — codepen.io

A fresh #Codevember carrot -

Draggable "Jelly" fish 🐡🐟😅 — codepen.io

The animation on drag on this fish is so cute, try dragging it around!

Flashlight effect at haunted house — codepen.io

Oooh - it seems Halloween isn't over yet. The scene descends into darkness and you can explore the scene using a mouse-controlled flashlight

Kitty Kitty — codepen.io

Aww. A super-cute CSS kitty! 😻

Kinetic Type — codepen.io

Wow, some crazy text effect here

CSSimon — codepen.io

Every played the classic memory game, Simon? Here's a CSS-based recreation of the classic game

Text clipping and perspective parallax — codepen.io

Gorgeous effect here using text clipping

Infinity Carousel — codepen.io

Bookmark this one for when you need a handy animated carousel! (Or, you can also see my version in my video course, just saying)