Open the menu Skip to main content

Theme

To change the color scheme for the menu, use the theme option.

<script>
    document.addEventListener(
        "DOMContentLoaded", () => {
            new Mmenu( "#menu", {
                theme: "dark"
            });
        }
    );
</script>

Example

Give it a go, change the options below and see how it affects the menu.

<script>
    document.addEventListener(
        "DOMContentLoaded", () => {

        }
    );
</script>

Options for the "theme" add-on

Option Datatype Default value Description
theme String "light" The theme to use.
Possible values: "light", "dark", "white", "blac",, "light-contrast", "dark-contrast", "white-contrast" and "black-contrast".

Configuration for the "theme" add-on

The "theme" add-on has no configuration options.

CSS variables for the "theme" add-on

The "theme" add-on has no CSS variables.

API methods for the "theme" add-on

Method( arguments ) Datatype Default value Description
theme Invoke this method to change the color scheme.
(
themename String The theme to use.
Possible values: "light", "dark", "white", "blac",, "light-contrast", "dark-contrast", "white-contrast" and "black-contrast".
)