getTheme

The getTheme function returns the current theme applied to the page or a specific element.

The available themes are light, dark, and auto. For more information, see the Dark Mode section.

Usage

Import the function:

import { getTheme } from 'mdui/functions/getTheme.js';

Example:

// Get the theme on <html>
getTheme();

// Get the theme on an element with class="element"
getTheme('.element');

// Get the theme on a specified DOM element
const element = document.querySelector('.element');
getTheme(element);

API

getTheme(target?: string | HTMLElement | JQ<HTMLElement>): 'light' | 'dark' | 'auto'

This function retrieves the theme of a specified element. The target can be a CSS selector, a DOM element, or a JQ object. If no target is provided, it defaults to the <html> element.

The function returns light, dark, or auto. If no theme is set on the element, it defaults to light.

snackbar

setTheme