InitColorSchemeScript API
API reference docs for the React InitColorSchemeScript component. Learn about the props, CSS, and other APIs of this exported module.
Demos
For examples and details on the usage of this React component, visit the component demo pages:
Import
import InitColorSchemeScript from '@mui/material/InitColorSchemeScript';
// or
import { InitColorSchemeScript } from '@mui/material';Learn about the difference by reading this guide on minimizing bundle size.
Props of the native component are also available.
| Name | Type | Default | Description |
|---|---|---|---|
| attribute | string | 'data-mui-color-scheme' | DOM attribute for applying a color scheme. |
| colorSchemeNode | string | 'document.documentElement' | The node (provided as string) used to attach the color-scheme attribute. |
| colorSchemeStorageKey | string | 'mui-color-scheme' | localStorage key used to store |
| defaultDarkColorScheme | string | 'dark' | The default color scheme to be used in dark mode. |
| defaultLightColorScheme | string | 'light' | The default color scheme to be used in light mode. |
| defaultMode | 'dark' | 'light' | 'system' | 'system' | The default mode when the storage is empty (user's first visit). |
| modeStorageKey | string | 'mui-mode' | localStorage key used to store |
| nonce | string | - | Nonce string to pass to the inline script for CSP headers. |
Source code
If you did not find the information in this page, consider having a look at the implementation of the component for more detail.
