How do I make dark effect slowly change and not suddenly in my react app

Question

https://covid-tracker-beta.vercel.app/

Answer 1

Kinda hard to help without seeing your code but perhaps this may be of help:

https://medium.com/better-programming/how-to-implement-dark-mode-in-your-react-app-63c1a0c5e337

Depending on the way you implemented.

In the tutorial there was usage of "transition" property achieve the effect:

.night {
...
background-color: black;
transition: background-color 0.3s, color 0.3s;
}

edit:
after seeing there is a link to the project GitHub page and seeing it uses MaterialUI i found this:

https://next.material-ui.com/customization/transitions/

Answer 2

Dm

Answer 3

Please help

Answer 4

Burey thanks for the resources, I'll check them out