setColorScheme

The setColorScheme function is used to set the color scheme for the current page or a specific element based on a provided hexadecimal color value. This function affects all mdui components on the page. For more information, refer to the Dynamic Color section.

Usage

Import the function:

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

Example:

setColorScheme('#ff0000');

API

setColorScheme(color: string, options: Options): void;

Options

Property	Type	Default
`target`	`string \| HTMLElement \| JQ<HTMLElement>`	`document.documentElement`
The element to which the color scheme should be applied. The value can be a CSS selector, a DOM element, or a JQ object. If this parameter is set, the color scheme will only take effect within the specified element. The default value is `document.documentElement`, which refers to the `<html>` element and affects the entire page.
`customColors`	`CustomColor[]`	-
An array of custom colors. For usage, please refer to the Dynamic Color section.

CustomColor

Property	Type	Default
`name`	`string`	-
The name of the custom color.
`value`	`string`	-
The hexadecimal value of the custom color, such as `#f82506`.

getColorFromImage

Up Next

removeColorScheme