Build a Curvaceous Homepage // Wavy Background Tutorial with SVG & CSS
Learn how to design a website with curved or wavy backgrounds using HTML and CSS. Then take things to the next level by adding a morphing SVG animation with JavaScript https://fireship.io/lessons/wavy-back...
#webdev #css #tutorial
🔗 Resources
Code https://github.com/fireship-io/wavy-c...
Shape Driver https://www.shapedivider.app/
Haikei App https://haikei.app/
📚 Chapters
00:00 Wavy Web Design
00:49 Flat HTML Website
03:26 CSS Wave
05:51 CSS Bubble
06:21 SVG Wave
07:15 SVG Layered Wave
08:58 Animated Blob
🤓 Install the quiz app
iOS https://itunes.apple.com/us/app/fires...
Android https://play.google.com/store/apps/de...
🔥 Watch more with Fireship PRO
Upgrade to Fireship PRO at https://fireship.io/pro
Use code lORhwXd2 for 25% off your first payment.
🎨 My Editor Settings
- Atom One Dark
- vscode-icons
- Fira Code Font
Watch video Build a Curvaceous Homepage // Wavy Background Tutorial with SVG & CSS online without registration, duration hours minute second in high quality. This video was added by user Fireship 19 August 2021, don't forget to share it with your friends and acquaintances, it has been viewed on our site 1,093,755 once and liked it 47 thousand people.