25-03-2024 13:00 via smashingmagazine.com

Setting And Persisting Color Scheme Preferences With CSS And A “Touch” Of JavaScript

Many modern websites give users the power to set a site-specific color scheme preference. A basic implementation is straightforward with JavaScript: listen for when a user changes a checkbox or clicks a button, toggle a class (or attribute) on the <body> element in response, and write the styles for that class to override design with a different color scheme.
CSS’s new :has() pseudo-class, supported by major browsers since December 2023, opens many doors for front-end developers. I&r
Read more »