Category Archives: Playground

Feb 15, 2024
Reflection Scroll Effect | Codrops
The other day I was marvelling over this amazing animation by Jurica Koletic that he made for Hot Type. It’s very much skeuomorphic and sorry, but I’m a total sucker...
Continue reading
On-Scroll Revealing WebGL Images | Codrops
Having objects appear on scroll is almost standard nowadays. However, there aren’t too many options available when it comes to HTML. Therefore, I decided to add a dash of excitement...
Continue reading
Jan 31, 2024
On-Scroll Animation Ideas for Sticky Sections
Some ideas of how sticky sections can be animated while exiting the viewport. Sticky sections have been around for a while and are quite important for scrollytelling. Today, I want...
Continue reading
Experimental CSS-Only Carousels with Scroll-Driven Animations
I bookmarked these beautiful carousel designs by Francesco Zagami months ago, and after learning about the new scroll-driven animation properties, I thought I’d take a stab at recreating them with...
Continue reading
Experimental On-Scroll Text Animations with SVG Clip-Path
You may have come across those design elements with knockout “text”, revealing an image or pattern behind it. Sometimes, it doesn’t even look like text, but more like shapes: Or...
Continue reading
Grid Item Hover Effect | Codrops
Three hover effects based on a grid design by Alena Orlova. The other day I stumbled upon this really beautiful grid design by Alena Orlova: I love the details of...
Continue reading
On-Scroll Perspective Grid Animations | Codrops
In the past couple of weeks we have been exploring a lot of scroll-based animations. Especially layouts with images are super interesting when changed on scroll. Today I’d like to...
Continue reading
On-Scroll Column & Row Animations
After getting so much positive feedback regarding our last scroll-based demos, I got really motivated to explore some more ideas. So today we are all about animating images of rows...
Continue reading
Aug 30, 2023
Connected Grid Layout Animation | Codrops
Some ideas for simple on-scroll animations on “connected” grid layouts. After previously experimenting with the row and column animations for grid items, I was wondering how animations could work in...
Continue reading