Recent searches
Search options
what's the laziest dark mode implementation? is there a 3-liner code change? 
asking for a friend (not me)
@ayo I'm aware of these two:
- 2019: https://chenhuijing.com/blog/friends-dont-let-friends-implement-dark-mode-alone/
- 2023: https://meyerweb.com/eric/thoughts/2023/01/16/minimal-dark-mode-styling/
chenhuijing.com · Friends don't let friends implement dark mode aloneSo I have this friend, Wei, who’s basically an expert with CSS blend modes, right? And she came up with a really interesting method to implement dark mode on her site with blend modes.
Aral Balkan · Implementing dark mode in a handful of lines of CSS with CSS filtersI finally got round to implementing dark mode for this site (the cobbler’s children have no shoes and all that…)
Here’s all the CSS I had to add:
@media (prefers-color-scheme: dark) { /* Invert all elements on the body while attempting to not alter the hue substantially. */ body { filter: invert(100%) hue-rotate(180deg); } /* Workarounds and optical adjustments. */ /* Firefox workaround: Set the background colour for the html element separately because, unlike other browsers, Firefox doesn’t apply the filter to the root element’s background.