Testing Dark Mode CSS in Firefox
Because this took me way too long to figure out.
Update:
The mentioned setting is now enabled by default, starting from Firefox 87.
To whom it may concern, i.e. future me after installing Firefox on a new machine:
Firefox has a button that can simulate and toggle the prefers-color-scheme
CSS media setting that
enables easy testing of different themes/styles.
To enable this cool little button in the styles section of the dev tools Inspector
, follow
these instructions [1]:
- Go to
about:config
page - Set
devtools.inspector.color-scheme-simulation.enabled
totrue
References
[1] Thanks, Toastrackenigma. I don’t know why it took me so long to find your post.