Documentation / Free widgets

Free

Dark Mode Toggle

A toggle that switches the page between light and dark.

Where Elementor panel → LandTech Extras → Dark Mode Toggle.

Open the live demo

How to use it

  1. Define CSS variables or theme dark styles (html.ltxe-dark or the class the widget documents).
  2. Drag Dark Mode Toggle into the header.
  3. Set labels and whether to follow system preference on first visit.
  4. Publish. Choice is stored in the browser.

Notes

  • Style both themes so text never becomes white-on-white. Test the Demo Hub and your own pages.