Soft UI Dashboard - Dark Mode Support (free sample)

Hello coders!

This article provides a short explanation of the dark mode enhancement crafted on top of Soft UI Dashboard, a popular open-source template released by Creative-Tim. The project can be found on Github, and the sources, based on the permissive (MIT) license, can be used in commercial projects or eLearning activities. Thanks for reading!

Enhanced version of the original template with Dark Mode - LIVE Demo

• 👉 Soft UI Dashboard Dark Support - Django Version (free product)
• 👉 Soft UI Dashboard Dark Support - Flask Version (free product)
• 🚀 Soft Dashboard Generator - LIVE & Free Service

---

---

👉 How it works

This enhancement was made by coding the following steps:

• Create a new JS file that handles the user interactions
  • Source code: dark-mode-handler.js
• CSS/SCSS files for the style changes
  • Sources: CSS and SCSS
• Gulp scripts update to handle the new SCSS file

The new files (dark-mode-handler.js and dark-theme-core.css) are included in the pages. The CSS file goes to the header and the JS goes at the bottom, just before closing