Светлая 🌕 и тёмная 🌑 темы на CSS: кастомные свойства, подключение, фолбэк для старых браузеров

00:00 Интро
02:17 Обзор демки
04:23 Описание задачи
05:11 Светлая тема
07:54 Тёмная тема
08:50 Обозначение тем
10:39 Удобное тестирование
11:54 Тема для Safari
14:11 Кроссбраузерность
16:23 Фолбэк на всякий
18:49 Подсказка браузеру
19:45 Выводы
20:42 Аутро

Нравится? Становитесь патронами   / pepelsbey  

Демо с небом https://pepelsbey.github.io/playgroun...
Средний цвет картинки https://matkl.github.io/average-color/
Prefers-color-scheme: Hello darkness, my old friend https://web.dev/prefers-color-scheme/
Improved dark mode default styling with the color-scheme https://web.dev/color-scheme/

Фото светлого неба https://unsplash.com/photos/G-6kwVnClsE
Фото тёмного неба https://unsplash.com/photos/ZPRgmVqgPj0

* * *

Камера: Sony A7C
Объектив: Sony 24–70 мм, f/4
Микрофон: Audio-Technica BP40
Свет: Amaran 200d + Light Dome
Софт: DaVinci Resolve, iZotope RX