How to Build a Light/Dark Toggle Button for Themes

[justintadlock]

In December, I published a tutorial on mastering light/dark styles in block themes using only theme.json (ticket: #336). Since then, Gutenberg has opened a new <button> option for the Button block (previously only a link). Coupled with the Interactivity API and a filter on block render, it's now possible to create interactive buttons without building a custom block.

The plan for this tutorial is to write a followup that builds upon the original tutorial, showcasing how to build the toggle button to switch between light and dark mode and persisting it across page views. Quick demo of a working prototype:

light-dark-toggle.mp4

[justintadlock]

This proposal was approved and has now been moved to a ticket: #379

[justintadlock]

Published here: https://developer.wordpress.org/news/2025/09/building-a-light-dark-toggle-with-the-interactivity-api/