Firefox Test Dark Mode

My previous theme indiefeed supported both light and darkmode. The current one does not. I’m in the process of fixing that. But I didn’t know how to test it ? i.e. Depending on the time of the day, Firefox would either select light mode or dark. Turns out, Developer tool lets you switch it (for that page). When in Inspector tab, look for icons for Sun (light) and moon (dark).

Continue Reading »

How to Support Both Light and Dark Mode for your app

Add something like the following to your css @media (prefers-color-scheme: light) { body { background-color: #f0f0f0; } } @media (prefers-color-scheme: dark) { body { background-color: #0f0f0f; } } I’m just learning this. But this above doesn’t look scalable. My previous theme, defined colors as variables, per color-scheme and in the other css, use these variables instead of actual colors. That way, you need to modify colors only at one place 🎉

Continue Reading »