How to create a slick animation from Schitt's Creek (TV series title sequence)

1

GreenSock

I am going to use Greensock animation library (GSAP) because it will be easier to find the right easing and timing values initially. If it is straightforward enough, then I can change it to a pure CSS animation.

#Javascript UI Libraries #Gradient Generator #JS Library 54 social mentions

2

Clippy - CSS clip-path Generator

I find it easiest to grab a polygon() clip-path with a few control points from Clippy CSS clip-path maker. I will grab the Rhombus clip-path as per screenshot below .i.e. clip-path: polygon(50% 0%, 100% 50%, 50% 100%, 0% 50%); is the snippet I have copied and added to the ::after:.superscript rule.

#Design Tools #Developer Tools #Gradient Generator 23 social mentions