CSScolor-scheme Property
Definition and Usage
Thecolor-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) |
