CSS color-scheme Property
Definition and Usage
The color-scheme
property
indicates which operating system color scheme an element should render with.
Common choices for operating system color schemes are "light" and "dark", or "day mode" and "night mode".
Default value: | normal |
---|---|
Inherited: | yes |
Version: | CSS Color Adjustment Module Level 1 |
JavaScript syntax: |
Browser Support
The numbers in the table specify the first browser version that fully supports the property.
Property | |||||
---|---|---|---|---|---|
color-scheme | 81 | 81 | 96 | 13 | 68 |
CSS Syntax
color-scheme: normal|light|dark|only light|only dark|light dark;
Property Values
Value | Description |
---|---|
normal | The element can be rendered with the OS default color scheme |
light | The element can be rendered with the OS light color scheme |
dark | The element can be rendered with the OS dark color scheme |
only light | The element should only be rendered with the OS light color scheme. Forbids the browser to override the color scheme for the element |
only dark | The element should only be rendered with the OS dark color scheme. Forbids the browser to override the color scheme for the element |
light dark | The element can be rendered with the OS light or dark color scheme (depends on the user's settings) |