Skip to content
Go to file


Lightweight and cross-browser DarkModeJS helps you to auto detect user's time and switch theme to darkside. Also, it's weight only 2.39KB (1.05KB gzipped) and written on pure Javascript, without any plugins and jQuery!


You can test on:


Just copy-paste this code to end of body tag:

<script src="darkmode.js"></script>
<script>var DarkMode = new DarkMode();</script>

Or use it with options:

<script src="darkmode.js"></script>
  var options = {
    light: "light.css",
    dark: "dark.css",
    startAt: "23:00",
    endAt: "06:00",
    checkSystemScheme: true,
    saveOnToggle: true
  var DarkMode = new DarkMode(options);

To display light theme for non-javascript user just copy-paste it to head (if you separate themes into light/dark stylesheets):

  <link rel="stylesheet" type="text/css" href="light.css">


Option Description Default Type
light Path to light stylesheet false String / Boolean
dark Path to dark stylesheet false String / Boolean
startAt Time to start Dark theme "21:00" String
endAt Time to end Dark theme "06:00" String
checkSystemScheme Check System Scheme true Boolean
saveOnToggle Save current Mode on Toggle (Local Storage) true Boolean


Event Description
getMode() Get current Mode
setMode("light"/"dark") Set Mode
isModeSaved() Check is Mode saved (Local Storage)
clearSavedMode() Remove Mode value (Local Storage), reinit Mode
toggleMode() Toggle current Mode
getSystemScheme() Get System Scheme (Returns light/dark/auto)


nickdeny –

Read us on Telegram[RU] –

You can’t perform that action at this time.