В операционных системах Windows и Mac OS появилась возможность переключать тему оформления с светлой на темную. С помощью стандартных операторов CSS можно переключать стили взависимости от выбранной темы оформления.
Для этого есть медиавыражение prefers-color-scheme. У него может быть два значения — dark и light. У него может быть два значения — dark и light. Все стили внутри блока выражения применяются только при включённой соответствующей теме:
@media (prefers-color-scheme: light) {
.rectangle {
color: #000;
background-color: #eee;
}
}
@media (prefers-color-scheme: dark) {
.rectangle {
color: #eee;
background-color: #555;
}
}
Code language: CSS (css)