Darkmode.Js 是一款开源项目，只需要添加一段代码，就可以为网站添加夜晚模式/黑暗模式/夜间模式/护眼模式，让你的网站跟上 UI 界的潮流。

只需要添加一段代码，就能在网页的右下角出现一个按钮，点击即可切换白天/夜晚模式。并且数据保存于本地浏览器，用户下次访问的时候依旧会根据上一次的设置显示。

代码如下：

<script src="https://cdn.jsdelivr.net/npm/darkmode-js@1.3.4/lib/darkmode-js.min.js"></script>
<script>
  new Darkmode().showWidget();
</script>

这是一个不需要任何技术，很容易使用的开源项目

默认选项：

var options = {
      bottom: '64px', // default: '32px'
      right: 'unset', // default: '32px'
      left: '32px', // default: 'unset'
      time: '0.5s', // default: '0.3s'
      mixColor: '#fff', // default: '#fff'
      backgroundColor: '#fff',  // default: '#fff'
      buttonColorDark: '#100f2c',  // default: '#100f2c'
      buttonColorLight: '#fff', // default: '#fff'
      saveInCookies: false, // default: true,
      label: '' // default: ''
}
 
const darkmode = new Darkmode(options);
darkmode.showWidget();

链接: https://www.fly63.com/nav/2943