Thomas Steiner is a Developer Advocate at Google Hamburg, focused on making the Web a better place through standardization, creating and sharing best practices, and doing research.
Along these lines, here's a custom element called <dark-mode-toggle> that initially respects the user's prefers-color-scheme user preference setting and also optionally allows for manually overriding it. Read more about it in this article (also mirrored here on DEV).
👋🏻 Hi, I'm Ryan! I am a Web Developer, Streamer, and Blogger transitioning careers into Full-Stack Web Development. Currently I enjoy working with React/NextJS, Astro, and Tailwind CSS.
Along these lines, here's a custom element called <dark-mode-toggle> that initially respects the user's
prefers-color-scheme
user preference setting and also optionally allows for manually overriding it. Read more about it in this article (also mirrored here on DEV).Ooh thanks for the link! I'll check it out today after work as that sounds like the best solution so far. Thanks, Thomas!