The color-index
CSS media feature can be used to test the number of entries in the output device's color lookup table.
Syntax
The color-index
feature is specified as an <integer>
value representing the number of entries in the output device's color lookup table. (This value is zero if the device does not use such a table.) It is a range feature, meaning that you can also use the prefixed min-color-index
and max-color-index
variants to query minimum and maximum values, respectively.
Examples
Basic example
HTML
<p>This is a test.</p>
CSS
p {
color: black;
}
@media (color-index) {
p {
color: red;
}
}
@media (min-color-index: 15000) {
p {
color: #1475ef;
}
}
Result
Custom stylesheet
This HTML will apply a special stylesheet for devices that have at least 256 colors.
<link rel="stylesheet" href="http://foo.bar.com/base.css" />
<link rel="stylesheet" media="all and (min-color-index: 256)" href="http://foo.bar.com/color-stylesheet.css" />
Specifications
Specification | Status | Comment |
---|---|---|
Media Queries Level 4The definition of 'color-index' in that specification. | Candidate Recommendation | The value can now be negative, in which case it computes to false. |
Media QueriesThe definition of 'color-index' in that specification. | Recommendation | Initial definition. The value must be nonnegative. |
Browser compatibility
The compatibility table on this page is generated from structured data. If you'd like to contribute to the data, please check out https://github.com/mdn/browser-compat-data and send us a pull request.
Update compatibility data on GitHub
Desktop | Mobile | |||||||||||
---|---|---|---|---|---|---|---|---|---|---|---|---|
color-index media feature
|
Chrome
Full support 29 |
Edge
Full support 79 |
Firefox
No support No |
IE
No support No |
Opera
Full support 16 |
Safari
Full support 8 |
WebView Android
Full support ≤37 |
Chrome Android
Full support 29 |
Firefox Android
No support No |
Opera Android
Full support 16 |
Safari iOS
Full support 8 |
Samsung Internet Android
Full support 2.0 |
Legend
- Full support
- Full support
- No support
- No support
color-index by Mozilla Contributors is licensed under CC-BY-SA 2.5.