Dark Mode
Last updated
Was this helpful?
Last updated
Was this helpful?
Dark mode is seamlessly integrated into Cwicly and requires minimal user intervention.
The user’s system preferences are automatically detected but a switch action is provided for manual selection.
Cwicly global colours support light and dark mode.
Light mode colours are applied by default.
A toggle is provided so that you can easily switch between light and dark modes.
In the Editor, navigate to the Cwicly Header Toolbar.
Click the Light/Dark Mode toggle to switch between Light and Dark modes.
You can apply a light mode value to a Global Colour.
Select a global colour.
Click the Light/Dark toggle in the Cwicly Header Toolbar to change to light mode.
Choose a suitable colour.
You can apply a dark mode value to a Global Colour.
Select a global colour.
Click the Light/Dark toggle in the Cwicly Header Toolbar to change to dark mode.
Choose a suitable colour.
The Dark Mode switch actions enables you to offer a user-initiated, accessibility focused switch between light and dark display modes for your website visitors.
User preference is remembered.
You can use the ready-made toggle provided.
The URL link below will take you to a Discourse page where you can download the button.
Drag and drop on to your page.
It should look something like this:
Or create your own.
Select an appropriate block.
Open the link settings.
Set Type to Action.
Set Action to Toggle (Dark Mode).
You can force a specific mode on a block irrespective of the mode currently applied.
Select a block.
In the Block Inspector, hover over the Force Colour Scheme icon.
Apply the desired mode.
Whether light or dark mode is selected, the forced mode will override.
