This feature is more involved that first look as this HN post unpacks.. https://news.ycombinator.com/item?id=23197966

My current wishlist:

- Three states (system/light/dark) - Preference stored for next time - Two icons light/dark (click selected icon a second time to 'turn it off' and return to system) - Vanilla JS/CSS/HTML - Leans into CSS

This implementation comes pretty close. https://www.bram.us/2020/04/26/the-quest-for-the-perfect-dark-mode-using-vanilla-javascript

This post points to a bunch of great three-state dark mode articles in its references. https://www.brycewray.com/posts/2024/01/its-tri-state-switch-time

Sidenote: I found some discussion towards a w3c web preferences API to make this easier but this is far from ready or resolved.

https://github.com/WICG/web-preferences-api https://front-end.social/@kizu/113160248251763608