Skip to content

Latest commit

 

History

History
14 lines (9 loc) · 1 KB

README.md

File metadata and controls

14 lines (9 loc) · 1 KB

Adding Dark Mode to your website with a few lines of CSS

The article explaining how this works can be found here: Read "Automatic Dark Mode for your website" by Seth Corker on Benevolent Bytes

Testing prefers-color-scheme, a feature that is now supported on most modern browsers including Chrome and Firefox.

This example uses @media (prefers-color-scheme: dark) { ... } to modify the look of the webpage. You could also use @media (prefers-color-scheme: light) { ... } to target light mode specifically.

Take a look at the Demo You should be able to try this out on any modern browser

If you'd like to learn more about some cool things you can do with CSS, take a look at "The Wonders of Dangerous CSS" on Benevolent Bytes. You'll learn about some CSS features you can use right now to enhance your website without touching JavaScript.