Mode Switcher Widget
Use the widget to change your site mode from light to dark and vice versa.
Content
Switcher
Type: Choose the switcher type between Toggle, Single Button and Two Buttons.
Settings for Toggle type
Alignment: Choose between Start, Center and End alignment for desktop, tablet and mobile.
Toggle
Set Second and Main toggles.
Alignment: Choose between Start, Center and End alignment for desktop, tablet and mobile.
Text: Add the needed text here.
Icon: Add the Icon and choose Before or After Icon Position.
Settings for Single Button type
Alignment: Choose between Start, Center and End alignment for desktop, tablet and mobile.
Button
Width: Set the button width for desktop, tablet and mobile.
Text Alignment: Choose between Start, Center and End text alignment for desktop, tablet and mobile.
Set Second and Main toggles.
Text: Add the needed text here.
Icon: Add the Icon and choose Before or After Icon Position.
Settings for Two Buttons type
Alignment: Choose between Start, Center and End alignment for desktop, tablet and mobile.
Elements Gap Between: Set the gap between buttons.
Button
Set Second and Main toggles.
Text: Add the needed text here.
Icon: Add the Icon and choose Before or After Icon Position.
Style
Toggle
Width: Set the toggle width for desktop, tablet and mobile.
Height: Set the toggle height for desktop, tablet and mobile.
Typography: Set a Typography using settings from the dropdown.
For Second and Main toggle
Color: Set the desired border color.
Background Type: Choose between Color and Gradient background type.
Background Color: Set the background color .
Border Color: Set the border color.
Box Shadow: Choose desired settings from the dropdown.
Text Shadow: Choose desired settings from the dropdown.
Border Type: Choose the border type from the dropdown and set it.
Border Radius: Set the border radius.
Padding: Set paddings for desktop, tablet and mobile.
Indicator
Width: Set the indicator width for desktop, tablet and mobile.
Height: Set the indicator height for desktop, tablet and mobile.
Horizontal Offset: Set the indicator horizontal offset for desktop, tablet and mobile.
For Second and Main toggle
Background Type: Choose between Color and Gradient background type.
Background Color: Set the background color .
Border Color: Set the border color.
Box Shadow: Choose desired settings from the dropdown.
Border Type: Choose the border type from the dropdown and set it.
Border Radius: Set the border radius.
Icon
Icon Size: Set the icon size for desktop, tablet and mobile.
For Second and Main toggle
Color: Set the icon color.
Background Color: Set the icon background color .
Border Color: Set the icon border color.
Box Shadow: Choose desired settings from the dropdown.
Border Type: Choose the border type from the dropdown and set it.
Border Radius: Set the border radius.
Padding: Set paddings for desktop, tablet and mobile.
Gap Between: Set the gap between icon and indicator for desktop, tablet and mobile.
Advanced
Set the Advanced options that are applicable to this widget