How To Make Website DARK MODE | Dark Theme Website Design Using HTML, CSS & JS
Learn How To Make Dark Mode On Website | Dark Mode, Dark Theme Website Design Using HTML CSS and JavaScript Step by Step
In this video we will create light mode and dark mode switching option on website using HTML CSS and JavaScript. We will use CSS variables to change theme color from one place. after that we will add JavaScript that will change the theme color by clicking on icon, it will also change the icon from moon icon to the sun icon. after watching this video you can convert any website into dark mode or night mode or dark theme website.
Build your next awesome project:
https://www.tubebuddy.com/quicknav/la...
Build Website From Scratch (00:23):
• Responsive Portfolio Website From Scr...
GitHub Link (00:35):
https://github.com/Ade-mir/html-css-j...
Asset Link (01:15):
https://github.com/Ade-mir/dark-mode-...
Finished Dark Mode Repo:
https://github.com/Ade-mir/dark-and-l...
Chapters
00:00 What we are building / Finished Dark Mode Toggle Button
00:23 Project setup
02:37 Making our HTML ready for dark mode
19:04 Creating CSS variables in order to change to dark mode
30:16 Adding JavaScript for dark mode toggle button logic
49:10 Changing hardcoded colors to CSS variables
Hope you enjoyed this tutorial. Leave a like if you did, and feel free to subscribe for more tutorials like this in the future!
