DEV Community

Discussion on: Create A Dark/Light Mode Switch with CSS Variables

Collapse
 
desi profile image
Desi

this is great and so helpful - thanks so much! I do have one question - in the js, where does "light" come from? unless I'm missing it, that's not defined in the CSS, is it?

Collapse
 
ananyaneogi profile image
Ananya Neogi

Hi Desi!
You're right, it's not defined anywhere.
If CSS doesn't find any specific styles related to light it will default back to the normal variables defined in :root.

Why I added it?
I added it so that we can use it while checking for the saved theme in localStorage further and add it to the root element. It will also be useful in cases where you might want to add some specific styles for light apart from the default styles.

I hope this helps 🙂

Collapse
 
desi profile image
Desi

Awesome, thanks so much! Explanation makes perfect sense.

Thread Thread
 
ananyaneogi profile image
Ananya Neogi

You're welcome 🙂