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, duration hours minute second in high quality that is uploaded to the channel Fireship 19 August 2021. Share the link to the video on social media so that your subscribers and friends will also watch this video. This video clip has been viewed 1,093,755 times and liked it 47 thousand visitors.
