Card Hover Effect using HTML CSS || No JavaScript

Published: 25 September 2021
on channel: CodeIT
173
10

Hello, world!!! In this video, we will create an awesome card hover effect using pure CSS and NO JavaScript... We also have an overlay effect on the card that helps the text appear nicely. We use pseudo elements (::before) to achieve this effect. The overlay consists of a linear-gradient background that makes it even more attractive and interactive. If you like the video, hit the like button and do subscribe to our channel for more videos just like this one :)

🔗 Important Links:
🌟 Card Image: https://images.unsplash.com/photo-145...
🌟 Tutorial of CSS Variables:    • how to use CSS Variables | css custom prop...  

📝 Sourcecode:
https://codepen.io/pen/?template=zYzdaKa

📺 Must watch videos 🤩
▶ CSS Variables Tutorial:    • how to use CSS Variables | css custom prop...  
▶ Top Visual Studio Code extensions:    • Top visual studio code extensions themes a...  
▶ Underline CSS Hover effect:    • Cool underline CSS hover effect 😎. || CSS ...  
▶ Reveal Elements on scroll:    • Reveal elements on scroll using pure javas...  
▶ Parallax effects:    • Parallax Effects  
▶ Pure vanilla JavaScript projects:    • Pure vanilla JavaScript projects  

🌎 Find me on:-
Github:- https://github.com/ani-24
Codepen:- http://codepen.io/codeit-ani
Discord:-   / discord  

###############################################################

Thanks for watching the video, make sure you are subscribed to my channel and press the bell icon so that you don't miss any of our videos.

Subscribe to my channel:
   / @codeityt  

Also, share the videos with those who need them.


On this page of the site you can watch the video online Card Hover Effect using HTML CSS || No JavaScript with a duration of hours minute second in good quality, which was uploaded by the user CodeIT 25 September 2021, share the link with friends and acquaintances, this video has already been watched 173 times on youtube and it was liked by 10 viewers. Enjoy your viewing!