@media (prefers-color-scheme:dark) {
        /*
    * 颜色预设
    */
         :root {
            --main-background-color: rgba(18, 18, 18, 1);
            --block-background-color: rgba(32, 32, 32, 1);
            --line-background-color: rgba(44, 44, 44, 1);
            --high-text-color: rgba(255, 255, 255, 0.87);
            --modium-text-color: rgba(255, 255, 255, 0.60);
            --disabled-text-color: rgba(255, 255, 255, 0.38);
        }
        /*
    * 背景
    */
        body {
            color: var(--modium-text-color) !important;
            background-color: var(--main-background-color) !important;
        }
        /*
    * 头部
    */
        #logo {
            color: var(--high-text-color) !important;
        }
        #header .site-name .description {
            color: var(--modium-text-color) !important;
        }
        /*
    * 菜单
    */
        #header {
            border-bottom: 1px solid var(--line-background-color) !important;
        }
        #header #nav-menu a {
            color: var(--modium-text-color) !important;
        }
        #header #nav-menu a:hover {
            border-bottom-color: var(--modium-text-color) !important;
        }
        #header #nav-menu a.current {
            border: 1px solid var(--line-background-color) !important;
            border-bottom-color: var(--main-background-color) !important;
        }
        /*
    * 文章头
    */
        .post .post-title a {
            color: var(--high-text-color) !important;
        }
        .post .post-title {
            color: var(--high-text-color) !important;
        }
        .post .post-meta {
            color: var(--modium-text-color) !important;
        }
        .category a,
        .category button.submit {
            color: var(--disabled-text-color) !important;
        }
        .category a:active,
        .category a:hover {
            color: var(--modium-text-color) !important;
        }
        /*
    * 文章内容
    */
        .post .post-content h2,
        .post .post-content h3 {
            color: var(--high-text-color) !important;
        }
        .post .post-content h2 {
            border-bottom: 1px solid var(--line-background-color) !important;
        }
        .post .post-content {
            color: var(--modium-text-color) !important;
        }
        .post .post-content hr {
            border-top: 1px solid var(--line-background-color) !important;
        }
        .codeblock,
        figure.highlight {
            color: var(--modium-text-color) !important;
            background: var(--block-background-color) !important;
        }
        .codeblock .gutter,
        figure.highlight .gutter {
            background: var(--block-background-color) !important;
            border-right: 1px solid var(--line-background-color) !important;
        }
        .btn-copy {
            color: var(--disabled-text-color) !important;
        }
        .btn-copy:hover {
            color: var(--modium-text-color) !important;
        }
        .codeblock .code pre::-webkit-scrollbar,
        figure.highlight .code pre::-webkit-scrollbar {
            background: var(--block-background-color) !important;
        }
        .codeblock .code pre::-webkit-scrollbar-thumb,
        figure.highlight .code pre::-webkit-scrollbar-thumb {
            background: var(--disabled-text-color) !important;
        }
        .post .post-content p code {
            background: var(--block-background-color) !important;
        }
        .post .post-content ol code,
        .post .post-content ul code {
            background: var(--block-background-color) !important;
        }
        table th {
            border-bottom: 2px solid var(--line-background-color) !important;
        }
        table tr:nth-child(2n) {
            background: var(--block-background-color) !important;
        }
        .readmore a {
            color: var(--modium-text-color);
            border: 1px solid var(--line-background-color);
        }
        .readmore a:hover {
            background: var(--block-background-color) !important;
        }
        .stressed-quote::before,
        blockquote::before {
            color: var(--high-text-color);
        }
        .stressed,
        blockquote {
            color: var(--modium-text-color);
        }
        /*
    * 历史
    */
        #process {
            background: var(--main-background-color) !important;
        }
        #process .dot_tp {
            background-color: var(--main-background-color) !important;
            border: 3px solid var(--block-background-color) !important;
        }
        #process .line {
            background: var(--block-background-color) !important;
        }
        #process .dot_bt {
            background-color: var(--main-background-color) !important;
            border: 3px solid var(--block-background-color) !important;
        }
        #process .timeline-centered::before {
            background: var(--block-background-color) !important;
        }
        #process .timeline-centered .timeline-entry .timeline-entry-inner .timeline-icon {
            background: var(--main-background-color) !important;
            color: var(--modium-text-color) !important;
            border: 4px solid var(--line-background-color) !important;
        }
        #process span.number {
            color: var(--modium-text-color);
        }
        #process .timeline-centered .timeline-entry .timeline-entry-inner .timeline-label {
            background: var(--block-background-color) !important;
        }
        #process .born,
        #process .present {
            color: var(--modium-text-color);
            background: var(--block-background-color) !important;
        }
        #process .timeline-centered .timeline-entry .timeline-entry-inner .timeline-label::after {
            border-color: rgba(0, 0, 0, 0) var(--block-background-color) rgba(0, 0, 0, 0) rgba(0, 0, 0, 0);
        }
        #process .born::after,
        #process .present::after {
            border-color: var(--main-background-color) !important;
            border-left-color: var(--block-background-color) !important;
        }
        /*
    * 归档
    */
        .post-archive a,
        .post-archive button.submit {
            color: var(--disabled-text-color) !important;
        }
        .post-archive a:active,
        .post-archive a:hover {
            color: var(--modium-text-color) !important;
        }
        /*
    * 分类
    */
        .label-title {
            color: var(--disabled-text-color) !important;
        }
        /*
    * 右边组件
    */
        #sidebar {
            border-left: 1px solid var(--line-background-color) !important;
        }
        #sidebar .widget .widget-title {
            color: var(--modium-text-color) !important;
            border-bottom: 1px solid var(--line-background-color) !important;
        }
        #sidebar .widget .category-list-count {
            color: var(--disabled-text-color) !important;
        }
        #sidebar a,
        #sidebar button.submit {
            color: var(--disabled-text-color) !important;
        }
        #sidebar a:active,
        #sidebar a:hover {
            color: var(--modium-text-color) !important;
        }
        #sidebar .widget .search-form input {
            background: var(--main-background-color) 8px 8px no-repeat url(data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAAA0AAAANCAYAAABy6%2BR8AAAACXBIWXMAAAsTAAALEwEAmpwYAAAAIGNIUk0AAG11AABzoAAA%2FN0AAINkAABw6AAA7GgAADA%2BAAAQkOTsmeoAAAESSURBVHjajNCxS9VRGMbxz71E4OwgoXPQxVEpXCI47%2BZqGP0LCoJO7UVD3QZzb3SwcHB7F3Uw3Zpd%2FAPCcJKG7Dj4u%2FK7Pwp94HDg5Xyf5z1Pr9YKImKANTzFXxzjU2ae6qhXaxURr%2FAFl9hHDy%2FwEK8z89sYVEp5gh84wMvMvGiSJ%2FEV85jNzLMR1McqfmN5BEBmnmMJFSvtpH7jdJiZv7q7Z%2BZPfMdcF6rN%2FT%2F1m2LGBkd4HhFT3dcRMY2FpskxaLNpayciHrWAGeziD7b%2BVfkithuTk8bkGa4wgWFmbrSTZOYeBvjc%2BucQj%2FEe6xHx4Taq1nrnKaW8K6XUUsrHWuvNevdRRLzFGwzvDbXAB9cDAHvhedDruuxSAAAAAElFTkSuQmCC);
            border: 1px solid var(--line-background-color);
        }
        #local-search-result {
            background-color: var(--main-background-color) !important;
        }
        input:focus {
            outline: var(--main-background-color) auto 1px !important;
        }
        p.search-result {
            color: var(--disabled-text-color) !important;
        }
        #toc {
            border: 1px solid var(--line-background-color) !important;
        }
        #toc a,
        #toc button.submit {
            color: var(--disabled-text-color) !important;
        }
        #toc a:active,
        #toc a:hover {
            color: var(--modium-text-color) !important;
        }
        /*
    * 底部
    */
        .page-navigator {
            border-top: 1px solid var(--line-background-color) !important;
        }
        .page-navigator .current {
            background: var(--block-background-color) !important;
        }
        .page-navigator a,
        .page-navigator span {
            border: 1px solid var(--line-background-color) !important;
        }
        .page-navigator a:hover,
        .page-navigator span:hover {
            background: var(--block-background-color) !important;
        }
        #donate #DonateText {
            color: var(--block-background-color) !important;
            filter: grayscale(1);
        }
        #donate #github {
            filter: Invert();
            opacity: 1 !important;
        }
        #donate #donateBox {
            border: 1px solid var(--line-background-color) !important;
            opacity: 1;
        }
        #donate #donateBox li {
            background-color: var(--high-text-color) !important;
            border-right: 1px solid var(--line-background-color) !important;
        }
        #donate #donateBox li:hover {
            filter: none;
        }
        #donate #QRBox {
            background-color: rgba(255, 255, 255, .1);
        }
        .post-copyright {
            background: var(--block-background-color) !important;
        }
        .post-copyright span {
            color: var(--disabled-text-color) !important;
        }
        .post-copyright .copy-path:hover {
            color: var(--modium-text-color) !important;
        }
        .post-copyright :hover .fa-clipboard {
            color: var(--modium-text-color) !important;
        }
        .tags a,
        .tags button.submit {
            color: var(--disabled-text-color) !important;
        }
        .tags a:active,
        .tags a:hover {
            color: var(--modium-text-color) !important;
        }
        .article-share-link,
        .article-share-link.submit {
            color: var(--disabled-text-color) !important;
        }
        .article-share-link:active,
        .article-share-link:hover {
            color: var(--modium-text-color) !important;
        }
        .post-nav {
            border-top: 1px solid var(--line-background-color) !important;
        }
        .post-nav a,
        .post-nav button.submit {
            color: var(--disabled-text-color) !important;
        }
        .post-nav a:active,
        .post-nav a:hover {
            color: var(--modium-text-color) !important;
        }
        .gt-container .gt-meta {
            border-bottom: 1px solid var(--line-background-color) !important;
        }
        .gt-container .gt-header-textarea {
            border: 1px solid var(--line-background-color) !important;
            background: var(--block-background-color) !important;
        }
        .gt-container .gt-header-textarea:hover {
            background: var(--block-background-color) !important;
        }
        .gt-container .gt-header-preview {
            border: 1px solid var(--line-background-color) !important;
            background: var(--block-background-color) !important;
        }
        .markdown-body {
            color: var(--modium-text-color) !important;
        }
        .gt-container .gt-ico-github .gt-svg {
            filter: invert(1);
        }
    }