Skip to content

Darth-Knoppix/safari-theme-css

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

4 Commits
 
 
 
 

Repository files navigation

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.

About

A test using prefers-color-scheme for Safari Preview

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages