Élan includes a built-in light/dark theme toggle in the navigation. No external dark-mode plugin or Blogger gadget is required.
How the toggle works
Clicking the moon/sun button switches the document between light and dark mode. The control also updates its accessible label to indicate the mode that can be enabled next.
The visitor’s choice is remembered
Élan remembers the visitor’s light or dark mode choice as they move around the site.
Customize dark-mode colors
- Go to Theme → Customize → Advanced.
- Open Dark Mode.
- Adjust the dark page, surface and soft backgrounds.
- Adjust body, heading and muted text.
- Adjust accent, borders, navigation, footer and field backgrounds as needed.
Default dark palette
- Page background:
#191817 - Surface:
#211f1d - Soft background:
#292623 - Body text:
#d8d2cc - Heading:
#f1ece7 - Muted:
#aaa29b - Accent:
#b9977d - Border:
#3a3632
Testing
After changing dark colors, test the homepage, a post, comments, forms, footer, search overlay and mobile menu. Dark mode is site-wide, so judging it from one heroic homepage screenshot is rarely sufficient.