Responsive Admin Dashboard Panel in HTML CSS & JavaScript | Dark/Light Mode

Create Responsive Admin Dashboard Panel in HTML CSS & JavaScript | Dark/Light Mode | Codinglab

In this video, you will learn to create a Responsive Admin Dashboard Panel with Sidebar Menu using HTML CSS, and JavaScript. I also have added dark and light modes. If you choose a dark mode or close the sidebar, it will not change even webpage is refreshed or reopened, to make this I have used local storage.

🗂️ Get Source Code of this Admin Dashboard

🌐 Visit CodingNepal for helpful coding projects

⭐ Hire me on Fiverr

📷 Follow me on Instagram

🤝 Support my work with a coffee

Timestamps:
00:00 Admin Dashboard | Demo
02:50 Creating CSS color variable
02:52 Importing Font Icons
03:05 Creating Sidebar for Admin Panel in HTML
06:25 Importing Google Fonts
13:56 Creating Navlink hover Indicator
18:29 JavaScript code dark & light mode | toggle button
22:05 Creating Admin Dashboard Panel
26:47 JavaScript code to toggle sidebar
49:53 Making Admin dashboard panel responsive
56:05 Localstorage code to keep user selected mode & sidebar

#Admin_Panel #Sidebar_Menu #HTML_CSS_JavaScript

---

Music Credit:
Song: Ikson - Anywhere (Vlog No Copyright Music)
Music promoted by Vlog No Copyright Music.

Something 'bout July (Instrumental) by RYYZN

Deep Sea by Vendredi

Track: Lost Sky - Vision [NCS Release]
Music provided by NoCopyrightSounds.

Levianth & Axol - Remember (feat. The Tech Thieves) [NCS Release]

Lost Sky - Dreams pt. II (feat. Sara Skinner) [NCS Release]

Song: Ehrling - You And Me (Vlog No Copyright Music)
Music provided by Vlog No Copyright Music.

[vinothkumars]

May be its buttering you.. But have been searching for a html css dashboard with responsiveness for the past few days.. U saved my time.. Thanks a bunch

[carlosandressanchez]

Awesome, you are amazing! 🤯 Thanks for sharing your knowledge.

[CodingPorium]

Awesome one sir! Definitely a great improvement from your previous admin dashboard video🔥

[NamNguyen-zwxp]

Very good video, hope you can simple code and complete a web page (including: header, body, footer, ...), I want to refer to how to divide the layout as well as how to set the class name.

[diegohfazio]

Great job!! We are waiting the sources...😜
Thanks!!

[fdyrpgn]

man i freaking love you man how you do this hard thing??

[mymislife]

Good job. Your code quality is so good!

[meportuguez]

excellent, that is a very good product

[ntb]

Great job!!!Do more video...
You are cool!!!

[John-qtqk]

How to navigate to other menu ítems on click with js?

[rlxgroot]

Please make css tutorial basics + practical, i know there are so many in YouTube but i think you can make better than that all

[tgbjvui]

Очень подробно! Спасибо за видео! А можно Git, если он есть

[irumshahzadi]

Sir, how do I remove that primary color of the body? when I am resizing my screen it shows me the primary color on my dashboard content.

[DevsGame]

because not use reset css on int css ?

[nipunudara]

Woow this tutorial smooth like butter..this is how a perfect tutorial should be...

[bahauddin]

How to call content button resources. Thanks

[carlosgonzaga]

Very good job! In the first part of Javascript, addEventListener function is unable to work and changes to dark! The console log shows this error "a live reload enabled "