YoVDO

Switching Dark-Light Mode with JS and CSS Custom Properties - FEM Social Media Dashboard, Part 5

Offered By: YouTube

Tags

HTML & CSS Courses Web Development Courses Javascript Courses User Experience Courses Local Storage Courses

Course Description

Overview

Learn how to implement a dark/light mode toggle using JavaScript and CSS custom properties in this comprehensive video tutorial. Explore techniques for creating a two-option toggle, utilizing system preferences to load the appropriate theme, building toggle logic for manual theme changes, and saving user preferences in local storage. Follow along as the instructor demonstrates these concepts while building a social media dashboard project from Frontend Mentor. Gain valuable insights into responsive design, web development best practices, and practical implementation of user-controlled theme switching.

Syllabus

- Intro.
- Changing the toggle to a 2-option based on feedback.
- Use system preferences to load light or dark theme.
- Build the toggle logic to manually change light/dark theme.
- Save toggle settings in local storage.


Taught by

Coder Coder

Related Courses

Become a Mobile Web Specialist
Google via Udacity
JavaScript for beginners
Udemy
Build a Quiz App with HTML, CSS, and JavaScript
Udemy
Android: Room Fundamentals
Pluralsight
إنشاء لعبة الأسئلة باستخدام Vanilla JavaScript
Coursera Project Network via Coursera