Темная или светлая? Делаем переключение темы на CSS, автоматически или вручную

Во всех операционных системах сейчас есть переключение цветовой гаммы между светлой и темной. В этом видео я расскажу как сделать такое же поведение на сайте. Расскажу про оба способа: автоматическая смена темы, и смена темы по действию пользователя.

#html #css #javascript

Код из примера

Как я стал программистом

Как я переехал в Европу

Стрим: Карьера программиста

👉🏻 Больше влогов здесь:
#larchankavlog #larchanka

👉🏻 Ежедневные влоги:
#larchankadaily

👉🏻 Чем я снимаю:
➡️ Еще одна камера: Sony DSC-WX500

[xxxxxx-kzyi]

Вот такие видосы с фишками или инфой для начинающих - реально топ.

Развивай это направление. ;-)

[rslazamat]

Делись своим путем в программировании, это интересно. Больше кода !

[Seregaj]

Крутяк мужик. Я узнал пару новых моментов из столь не длинного видео.

[ИльяЩепин-жч]

Привет, очень классно все, побольше обучалок бы)

[egor.ermakov]

Наверно стоило еще показать как инпут кастомизировать)

[danielshapiro]

А как получить в js со стороны пользователя true / false в зависимости от его световой темы?

[aodax]

Слушай помоги мне с проблемой когда я хочу запустить ксс мне выбивает какуета ошыбку типо видимо вы не хотели этого сделать и такая надпись Error! Что делать?

[EvgenOl]

Ну да, ну да, я не учёл, что ты программист и было странно с моей стороны ожидать увидеть как сделать одновременно и ручное переключение И автоматическое. И не придерёшься, ведь в названии написано ИЛИ...

[RomanRachkov]

А почему бы для такой простой реализации дарк темы не юзнуть еще более простое

:root{
filter: invert(100%);
}

?

Да, согласен поплывут картинки/видео. Однако их же мы вылечим тупо таким же кодом

img, picture, video {
filter: invert(100%);
}

[STORIESPAY]

Ахах 🤣 зато прикол в том что после перезагрузки странички тема слетит 🤪

[qwestergame]

Миш есть риск что скоро останешься без работы !