Dark Mode Switch

screenshot of Dark Mode Switch
bootstrap

Basic Bootstrap 5 custom checkbox to use night mode in your web site.

Overview

The Light Switch for Bootstrap 5 is a tool that allows users to easily switch between light and dark modes on websites built using Bootstrap 5. It achieves this by manipulating the HTML tags and applying appropriate classes based on the default system theme. The user's choice is saved in local storage, ensuring that the selected mode persists across page reloads.

Features

  • Dark mode toggle: Allows users to switch between light and dark modes.
  • DOM manipulation: HTML tags are dynamically modified by adding or removing classes to switch between modes.
  • Local storage: The user's choice is saved in local storage under the name "lightSwitch".
  • Easy installation and setup: Users can download the latest release or clone the repository via git. It can also be installed using npm.
bootstrap
Bootstrap

Bootstrap is the most popular CSS Framework for developing responsive and mobile-first websites.

Dark Mode

Dark mode is a user interface option that uses a dark color scheme instead of light. It reduces eye strain and improves visibility in low-light conditions. Implementing dark mode in a website or application involves updating the styles and color palette to support both light and dark modes.