Animated Envelope with open animation || CSS + HTML only || Web Designing



Published
In this video we'll learn to design and animate an envelope using HTML and CSS only.

{{ Source Code }}
https://lab-swapnil.github.io/

{{ Video Chapters }}
00:00 : Preview
00:18 : Step-1 Markup
00:44 : Step-2 Style - Base
01:32 : Step-3 Style - Envelope
03:10 : Step-4 Animate - Envelope
03:52 : Step-5 Style - Letter
04:45 : Step-6 Animate - Letter
05:15 : Showtime

{{ Visit my Lab }}
https://www.youtube.com/SwapnilsLab

{{ Full Playlist }}
https://www.youtube.com/playlist?list=PL9tVtei_BGHlXnID6PVuMcpi7_FjyynNY

{{ Programming Basics }}
https://www.youtube.com/playlist?list=PL9tVtei_BGHmIxYo4qPqvbL6kf-5-q0YX

{{ Video Related }}
css animations,
css animation,
html css animation,
css icon design,
css mail icon design,
html css main icon design,
html css animation,
html css icons,
css icons,
css main icon,
css envelope,
css envelope design,
html css envelope,
html css envelope design,
html css letter design,
css letter design,
css email icon,
html css email icon,
html css email icon design,
envelope design,
envelope card design,
envelope design css,
envelope card design css,
envelope design html css,
envelope card design html css,

{{ Tags }}
#css , #html , #CSS , #HTML , #webdesign , #swapnilLab
Category
Web design
Be the first to comment