Hi. Loving the test-drive so far, but something has come up.
It seems a stretch to presume that I want a dark web site because I have set a dark mode setting in my os. Switching it to light mode, switches the appearance of my site in the browser to light.
My presumption is to see a light mode previewed site in the browser when in the light mode modus in Elements.
What is the reasoning behind this seemingly strange over-ride?
The light and dark mode support in Elements is handled automatically by following the viewer’s system preferences. If someone visiting your site has their device or browser set to dark mode, Elements will apply your dark mode styles. If they’re using light mode, the standard light styles will be shown.
This works thanks to Tailwind CSS’s media-based detection, which checks the user’s operating system or browser settings and applies the appropriate styles — no toggles or extra setup needed.
That said, we know not everyone wants to rely solely on system preferences. So yes, we’d like to add support for a Theme Switch component in the future. That way, visitors could manually toggle between light and dark modes on your site, regardless of their device settings. It’s definitely on our radar!