DEV Community

Discussion on: Dark mode toggle animation using CSS !

Collapse
 
ttebify profile image
ttebify

Weldone! I see you have a color property of value aliceblue in both icons. But I didn't notice any color change during the transition. Could it be because you placed it after the css opacity property, so it becomes fully transparent before any significant color change?

Collapse
 
ttebify profile image
ttebify

I just observed now that you don't have the color property set in the CodePen version.

Collapse
 
murtuzaalisurti profile image
Murtuzaali Surti

Yeah, because I have used SVG icons there and you must use fill property instead of color property in order to change the color of the SVG element.

Collapse
 
murtuzaalisurti profile image
Murtuzaali Surti

Color change is visible. If you want to see it in slow motion, just increase the duration of the transition!