Nobody Warned the SVG That a GSAP Scroll Animation Was About to Climb Inside Its Sunglasses

A flat SVG turns into a window you can fall through. In this tutorial we build the whole effect from scratch with GSAP, ScrollTrigger, and a bit of SVG trickery, all in plain HTML, CSS, and JavaScript.

Source Code: https://codegrid.gumroad.com/l/codegridpro

Inspiration: La Revoltosa
Website: https://larevoltosa.es/

Asset Used: https://www.magnific.com/free-vector/hand-drawn-pop-art-girl-illustration_31248346.htm

00:00 Intro
01:28 Assets
03:06 HTML
04:29 CSS
06:07 SVG Module
06:46 JavaScript

Instagram: https://www.instagram.com/codegridweb/
Twitter: https://twitter.com/codegridweb/
Public Discord: https://discord.gg/B8B9MXxuSS

Thanks for watching!