Dark mode at front-end?

With Cwicly update to 1.3.2, ist there any feature/ Block available to switch to dark-mode for visitors at the front end?

Hi @FZwo,

Please see my recent post highlighting the excellent video demo of this:

Great! Is that Button shown in the video for switching to darkmode available somewhere? Seems it has some code inside… If not, it would be great to have that in the library

It is demoed in the video at the starting time I added. It uses the Dark Mode > Toggle action. It is extremely straightforward to use.

at 8:49 it’s mentioned: “a ready made toggle is available in the description”…but in the description I can’t find something like that…it is this one I am searching for:

Button at the front-end shown as this:

And as block at the backend as this:

If I didn’t understand wrong, what’s provided in the latest release is a Link Action for “Light/Dark mor toggle”. You would have to design the icon yourself.

That is what I was asking for, to get provided that icon and switch logic shown in the video, instead trying to design it by myself

You might be interested in this request.

Hi @FZwo,

You can find the Dark mode toggle used in the video here:

toggle works with your code, but I don’t get that icon (sun, moon), or do I have to change something in your code to make it work?

Hello @FZwo,

The code block contains the necessary SVG.
Have you enabled all code block options in the Role Editor → https://docs.cwicly.com/themer/role-editor#code-block

Finally, the SVG inherits the parent’s current colour.


it is all enabled (PHP; CS, and JS). if I run the inserted JS code provided within the code block editor, it results in an “Syntax error, unexpected token :”, but if I put it to an online validator, it says the js code is correct

simply drag & drop the file into the editor, just take that literally:-) All set