light-level
is a CSS media feature that can be used to check the current ambient light level.
Enumerated values
Value | Meaning |
---|---|
dim |
|
normal |
|
washed |
|
Example
This code will likely not work on any devices (device compatablility is low)
@media (light-level: normal) { p { background: url("texture.jpg"); color: #333 } } @media (light-level: dim) { p { background: #222; color: #ccc } } @media (light-level: washed) { p { background: white; color: black; font-size: 2em; } }
Specifications
Specification | Status | Comment |
---|---|---|
Media Queries Level 4 The definition of 'light-level' in that specification. |
Working Draft | Defered to Media Queries Level 5 |
Browser compatibility
Feature | Chrome | Firefox (Gecko) | Internet Explorer | Opera | Safari |
---|---|---|---|---|---|
Basic support | ? | ? | ? | ? | ? |
Feature | Android | Firefox Mobile (Gecko) | IE Mobile | Opera Mobile | Safari Mobile |
---|---|---|---|---|---|
Basic support | ? | ? | ? | ? | ? |