Categories
General

Dark mode in 1 step

This should work relatively well for most websites:

@media (prefers-color-scheme: dark) {
  body {
    filter: invert(1);
    background: #000;  /* since most sites declare the background color */
  }
}

This will work pretty well for most sites unless your site has a lot of images.

Examples

If your images are inverted like reddit above, use the following:

img {
  filter: invert(1); /* flips it back */
}

Leave a Reply

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.