Responsive Website Landing Page with GSAP Animations | HTML and CSS Tutorial

In the past I've been asked several times to create a tutorial that uses GSAP animations. So today, we will create a modern responsive lading page that will use several animations on load. We will also use css clip-path and pseudo elements to create various effects.

[ HELP SUPPORT THE CHANNEL]

Get exclusive Patreon perks.
Patreon ►

[ SOCIAL MEDIA ]

Instagram ►

[ HOSTGATOR ]

Get affordable domain and web hosting with HostGator. Save up to 60% off of your entire purchase with the coupon code below.

HostGator ►
Coupon code ► JULIOCODES60
Video tutorial ►

[ GET IN TOUCH - TUTORIAL HELP ]

1. Zip up your source code
2. Attach the zipped source code to the email
3. Explain your issue

Email ► codingwithjulio@outlook.com

[ MY GEAR ]

Programming/Video editing laptop Specs & extras

Laptop: Dell XPS 15 7590
Processor: 9th Generation Intel Core i7-9750h
RAM: 32GB (Upgraded)
Graphics Card: Nvidia GeForce GTX 1650 4GB GDDR5
Storage: 500GB M. 2 PCIe NVMe SSD (Upgraded)
--- Extras ---
Monitor: Dell Ultrasharp 27"
Keyboard: Logitech MX Keys
Mouse: Logitech MX Master 3
Microphone: Blue Yeti

Dell XPS 15 7590

United States ►
United Kingdom ►
Canada ►
France ►

CORSAIR Vengeance Performance RAM

United States ►
United Kingdom ►
Canada ►
France ►

Samsung 970 EVO Plus SSD

United States ►
United Kingdom ►
Canada ►
France ►

Dell Ultrasharp 27" Monitor

United States ►
United Kingdom ►
Canada ►
France ►

Logitech MX Keys Keyboard

United States ►
United Kingdom ►
Canada ►
France ►

Logitech MX Master 3 Mouse

United States ►
United Kingdom ►
Canada ►
France ►

Blue Yeti Microphone

United States ►
United Kingdom ►
Canada ►
France ►

[ DISCLAIMER No. 1 ]

In order to speed up the development process CSS prefix are not used. In order to ensure cross browser compatibility please use prefixes where necessary.

[ DISCLAIMER No. 2 ]

This video description contain affiliate links, which means that if you click on one of the product links, I’ll receive a small commission. This helps support the channel and allows me to continue to make videos like this. Thank you for the support!

gsap,gsap 3,gsap tutorial,gsap 3 tutorial,gsap 3 2020,gsap 2020,greensock 3 tutorial,greensock animation platform,javascript animation,javascript animation library,javascript animation tutorial,julio codes,css landing page,responsive website,animated website,html tutorial,css tutorial,how to make a website,responsive website tutorial,build website from scratch,media queries,how to create a website,responsive web design,responsive navigation bar,