请注意，本文编写于 1707 天前，最后修改于 920 天前，其中某些信息可能已经过时。
本站目前已经支持点击右上角的图标，一键切换日/夜间模式了哦 
有同玩Typecho的小伙伴问源码在哪，今天就来分享一下 
下载上面的文件，解压后将CSS和JS分开上传对应目录下：
- /usr/themes/handsome/assets/css/darkmode.css
- /usr/themes/handsome/assets/js/darkmode.js
然后根据作者的指导，添加相应代码到主题文件里就可以啦 
但查理在使用后发现，有部分情况会出BUG，比如盒子模型下会有部分区域不切换夜间模式、首页图片过亮等问题。
这里分享一下优化新增的代码，大家根据自己需要选择性食用：
将这部分添加到
darkmode.css文件的/*跟随系统模式*/上面：
/*自定义优化部分*/
.night #bubble{
display: none;
}
.night .wrapper-md{
background: #151617;
}
.night .bg-danger .nav>li>a:focus, .night .bg-danger .nav>li>a:hover{
background-color: #1D1F20 !important;
}
.night .bg-danger .nav .open>a{
background-color: #1D1F20 !important;
}
.night .form-control{
background-color: #111 !important;
}
.night .OwO .OwO-logo{
background-color: #111 !important;
}
.night .panel-picture{
opacity: .5 !important;
}
.night .item-thumb{
opacity: .5 !important;
}
.night .alert-warning{
color: #ffffff;
background-color: #151617;
border-color: #1d1f20;
}
.night .tip.inlineBlock{
opacity: 0.5 !important;
color: #000;
}
将这部分添加到
darkmode.css文件最后的}之前：
/*自定义优化部分*/
body #bubble{
display: none;
}
body .wrapper-md{
background: #151617;
}
body .bg-danger .nav>li>a:focus, body .bg-danger .nav>li>a:hover{
background-color: #1D1F20 !important;
}
body .bg-danger .nav .open>a{
background-color: #1D1F20 !important;
}
body .form-control{
background-color: #111 !important;
}
body .OwO .OwO-logo{
background-color: #111 !important;
}
body .panel-picture{
opacity: .5 !important;
}
body .item-thumb{
opacity: .5 !important;
}
body .alert-warning{
color: #ffffff;
background-color: #151617;
border-color: #1d1f20;
}
body .tip.inlineBlock{
opacity: 0.5 !important;
color: #000;
}