CSS Viewport Height Comparison
I built this demo so you can see dvh vs lvh vs svh all side by side on the same screen.

Notice how the Dynamic Viewport column will change as the mobile browser UI hides and reveals itself.

@codepen.io demo: cdpn.io/pen/debug/wB...

Mixing 🟦 drops into 🟨 makes 🟩 but eventually the blue will dilute they yellow.

🚀 DEMO
Color Dripper: codepen.io/snorkltv/pen...

Diving into CSS Color Mix()-ing and Dripping!
Built this gizmo so that you can grab an array of colors throughout the mixing. This array is what powers my Color Dripper.

Generate nice olkch "color-mixed" gradient and compare it to the muddy css version.

🚀 DEMO
Mixer: codepen.io/snorkltv/pen...

🚀 Creative Coding Inspiration
Found this design on Canva and decided to take a stab at bringing it to life with HTML/CSS/GSAP.

So many things to consider. I went with a few clip-paths.

How would you do it?

codepen.io/snorkltv/ful...

This effect comes from the lovely k72.ca/en/work.
At first glance it looks like a simple staggered reveal of some pinned panels. The height of each element is being adjusted based on its vertical position as you scroll

1 ScrollTrigger + a juicy onUpdate callback

🎁 demo: codepen.io/snorkltv/ful...

Unlock over 250 practical (and sometimes silly) GSAP lessons to help you become a better animator and creative coder

www.creativecodingclub.com/bundles/crea...

With GSAP's repeatRefresh:true you can make a single tween have MULTIPLE end positions and delays. In the text rotator below each heading moves 100% its height up along the y axis on each repeat.

Responsive Text Rotator with Seamless Looping (Low Code)
codepen.io/snorkltv/pen...

I recently challenged myself to build animations with ONLY 3 circles. Here is the complete @codepen.io collection for you to explore: codepen.io/collection/y...

Lots of little @gsap.com tricks in there too 😀
Each demo is fully responsive too!

FREE SVG ANIMATION with #GSAP
I didn't want to come on here with another Black Friday sale so I'm offering my COMPLETE SVG Animation course for free🔥(100 students with code: BLSKY)
www.creativecodingclub.com/courses/svg-...
If you enroll I only ask that you please follow and repost. Thanks!