Мгновенный ночной режим

Если вы хотите быстро добавить вашему веб-сайту популярный «ночной режим», обратите внимание на CSS фильтры invert и hue-rotate.

• filter: invert() – инвертирует исходный цвет на указанное количество процентов. Если передать в функцию фильтра 1 (или 100%) белый цвет превратится в черный, а изображение – в свой негатив.
• filter: hue-rotate() – определяет угол поворота на цветовом круге, на который смещаются все цвета исходной картинки. Соответственно значение параметра должно быть от 0deg до 360deg.

Просто добавьте эти свойства тегу body. Вы увидите, как может выглядеть ваш сайт в ночном режиме.

Обратите внимание: чтобы фон изменил цвет на темный, его нужно предварительно сделать белым.

Вот так выглядит главная страница Google с такими настройками: