I need the animation after I hover the div. I.e, if I hover out of the div it just animate and come back to the initial state.

Question

https://sololearn.com/compiler-playground/WldMOnZ9W1iS/?ref=app

I am not sure whether the feature I am expecting is possible through keyframes or not

Answer 1

you can use transition.
I avoided duplicate divs by using pseudo-element :after instead.
Also, I used :active instead of :hover for momentary transition without needing to click outside to deactivate.

https://sololearn.com/compiler-playground/WWoaXfFZo06W/?ref=app