只需两行代码让你拥有酷炫的黑暗模式

去年开始，各种黑暗网页模式就已流行WEB圈，很多人苦于修改CSS工作量浩大，不愿意轻易尝试，今天，教你用两行代码搞定黑暗模式，可以随意切换，还很酷炫！

代码特点：

窗口小部件自动显示保存用户选择如果操作系统偏好的主题为深色，则自动显示Darkmode（如果浏览器支持prefers-color-scheme）可以以编程方式使用而无需小部件保存用户选择如果操作系统偏好的主题为深色，则自动显示Darkmode（如果浏览器支持prefers-color-scheme）可以以编程方式使用而无需小部件。

代码：

只需将此代码添加到您的 html 页面：

<script src="https:[email protected]/lib/darkmode-js.min.js"></script>
<script>   function addDarkmodeWidget() {     new Darkmode().showWidget();   }   window.addEventListener('load', addDarkmodeWidget); </script>

以下是可用的选项：

const 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: ''
   autoMatchOsTheme: true // default: true
 }
 
 const darkmode = new Darkmode(options);
 darkmode.showWidget();