How to Use CSS to Fade In and Fade Out HTML Text and Pictures

Tremaine Eto
Oct 23, 2019 · 4 min read
Believe it or not, this image of an adorable dog is fading in and out with only CSS and HTML (and then screen captured to put in this article). I’ll explain how.

If you have ever used video editing software — whether it’s Windows Movie Maker or Adobe Premiere Pro — then you are most likely familiar with the fade-in and fade-out video transitions. They’re extremely effective for creating a nice and polished feel, and there’s no reason why you shouldn’t be able to have that in your arsenal when you’re programming web applications.