☰

126邮箱深色模式

针对网易126邮箱(mail.126.com)的深色模式的样式表，使用 prefers-color-scheme ，跟随浏览器主题进行深色/浅色模式自动切换。

  1. /* ==UserStyle==
  2. @name         126邮箱深色模式
  3. @namespace    https://gf.qytechs.cn/zh-CN/scripts/487070-126邮箱深色模式
  4. @homepageURL  https://github.com/Steven-Zhl/4BetterBrowser/CSS#126邮箱深色模式
  5. @version      1.0-beta
  6. @license      GPL-3.0
  7. @description  针对网易126邮箱(mail.126.com)的深色模式的样式表，使用 prefers-color-scheme ，跟随浏览器主题进行深色/浅色模式自动切换。
  8. @author       Steven-Zhl
  9. @icon         https://mail.126.com/favicon.ico
  10. #match        https://mail.126.com/*
  11. ==/UserStyle== */
  12.  
  13. @-moz-document regexp("https?://(hw\\.)?mail\\.126\\.com/.*") {
  14.   @media (prefers-color-scheme: dark) {
  15.     /* PC端界面 */
  16.     div.frame-main-cont-body {
  17.       background-color: #000;
  18.       color: #8f8f8f;
  19.     }
  20.     div.frame-main-cont-body div.gWel-recommend.gWel-promt-radius.nui-closeable {
  21.       background-color: #1e1e1e;
  22.       border-color: #252525;
  23.       color: #8f8f8f;
  24.     }
  25.     div.frame-main-cont-body div.gWel-recommend.gWel-promt-radius.nui-closeable ul {
  26.       background-color: #272727;
  27.       border-color: #252525;
  28.     }
  29.     div.frame-main-cont-body div.gWel-recommend.gWel-promt-radius.nui-closeable ul li {
  30.       background-color: #272727;
  31.     }
  32.     div.frame-nav {
  33.       background-color: #000;
  34.       border-color: #252525;
  35.       color: #8f8f8f;
  36.     }
  37.     div.frame-nav div#dvNavTop {
  38.       background-color: #272727;
  39.     }
  40.     div.frame-nav div#dvNavTop ul li {
  41.       color: #272727;
  42.       background-color: #272727;
  43.       background-image: none;
  44.     }
  45.     div.frame-nav div#dvNavTop ul li span {
  46.       text-shadow: none;
  47.     }
  48.     div.frame-nav div#dvNavTree {
  49.       background-color: #1e1e1e;
  50.     }
  51.     div.frame-nav div#dvNavTree ul {
  52.       background-color: #1e1e1e;
  53.       border-color: #252525;
  54.       color: #8f8f8f;
  55.     }
  56.     div.frame-nav div#dvNavTree ul li {
  57.       border-color: #252525;
  58.       color: #8f8f8f;
  59.     }
  60.     div.frame-nav div#dvNavTree ul li div.js-component-component.nui-tree-item-label-hover,
  61.     div.frame-nav div#dvNavTree ul li div.js-component-component.nui-tree-item-label-active {
  62.       background-color: #272727;
  63.       background-image: none;
  64.     }
  65.     div.frame-nav div#dvNavTree ul li div.js-component-component.nui-tree-item-label-selected {
  66.       background-color: #272727;
  67.       background-image: none;
  68.     }
  69.     div.frame-nav div#dvNavTree ul li div.js-component-component.nui-tree-item-label-selected span {
  70.       color: #cdcdcd;
  71.       text-shadow: none;
  72.     }
  73.     div.frame-nav div#dvNavTree ul li#dvNavFoot:before {
  74.       background-color: #8f8f8f;
  75.     }
  76.     div.frame-nav div#dvNavTree ul li#dvNavFoot div.GV0 div:hover {
  77.       background-image: none;
  78.       background-color: #272727;
  79.     }
  80.     div#dvContainer header {
  81.       background-color: #1e1e1e;
  82.     }
  83.     div#dvContainer header div.nui-toolbar-item div {
  84.       background-color: #272727;
  85.       color: #8f8f8f;
  86.     }
  87.     div#dvContainer header div.nui-toolbar-item div span {
  88.       background-color: #272727;
  89.       border-color: #252525;
  90.       color: #8f8f8f;
  91.     }
  92.     div#dvContainer header div.nui-toolbar-ext div.nui-toolbar-item div.js-component-calendar.nui-calendar,
  93.     div#dvContainer header div.nui-toolbar-ext div.nui-toolbar-item div.js-component-select.nui-simpleSelect.nui-select {
  94.       background-color: #272727 !important;
  95.       color: #8f8f8f;
  96.     }
  97.     div#dvContainer header div.nui-toolbar-ext div.nui-toolbar-item div.js-component-calendar.nui-calendar span,
  98.     div#dvContainer header div.nui-toolbar-ext div.nui-toolbar-item div.js-component-select.nui-simpleSelect.nui-select span {
  99.       background-color: #272727;
  100.       border-color: #252525;
  101.       color: #8f8f8f;
  102.     }
  103.     div#dvContainer header div.nui-toolbar-ext div.nui-toolbar-item div.js-component-button.nui-roundBtn.nui-btn.nui-btn-hasIcon.nui-roundBtn-hasIcon.nui-btn-disabled.nui-roundBtn-disabled span {
  104.       background-color: #1e1e1e !important;
  105.       border-color: #252525 !important;
  106.     }
  107.     div#dvContainer header div.nui-toolbar-ext div.nui-toolbar-item div.js-component-button.nui-roundBtn.nui-btn.nui-btn-hasIcon.nui-roundBtn-hasIcon span {
  108.       background-color: #272727 !important;
  109.       border-color: #252525 !important;
  110.     }
  111.     div#dvContainer div.js-component-menu.nui-menu {
  112.       background-color: #1e1e1e;
  113.       border-color: #252525;
  114.     }
  115.     div#dvContainer div.js-component-menu.nui-menu div.nui-menu-split.nui-split {
  116.       border-color: #252525;
  117.     }
  118.     div#dvContainer div.js-component-menu.nui-menu div {
  119.       background-color: #1e1e1e;
  120.       border-color: #252525;
  121.       color: #8f8f8f;
  122.     }
  123.     div#dvContainer div.js-component-menu.nui-menu div:hover {
  124.       background-color: #272727;
  125.     }
  126.     div#dvContainer div.gWel-avatar img {
  127.       filter: invert(0.75);
  128.     }
  129.     div#dvContainer div.frame-main-cont-body.nui-scroll {
  130.       background-color: #000;
  131.     }
  132.     div#dvContainer div.frame-main-cont-body.nui-scroll div.Bp0 div {
  133.       filter: invert(1);
  134.     }
  135.     div#dvContainer div.frame-main-cont-body.nui-scroll div.js-component-layer.nui-dateLayer.nui-layer {
  136.       background-color: #1e1e1e;
  137.       border-color: #252525;
  138.     }
  139.     div#dvContainer div.frame-main-cont-body.nui-scroll div.js-component-layer.nui-dateLayer.nui-layer div.nui-dateLayer-title {
  140.       background-color: #272727;
  141.     }
  142.     div#dvContainer div.frame-main-cont-body.nui-scroll div.js-component-layer.nui-dateLayer.nui-layer div.nui-dateLayer-title strong {
  143.       color: #cdcdcd;
  144.     }
  145.     div#dvContainer div.frame-main-cont-body.nui-scroll div.js-component-layer.nui-dateLayer.nui-layer div.nui-dateLayer-title span.nui-txt-link {
  146.       color: #7d90a9;
  147.     }
  148.     div#dvContainer div.frame-main-cont-body.nui-scroll div.js-component-layer.nui-dateLayer.nui-layer div.nui-dateLayer-calendar table tbody tr th {
  149.       color: #cdcdcd;
  150.     }
  151.     div#dvContainer div.frame-main-cont-body.nui-scroll div.js-component-layer.nui-dateLayer.nui-layer div.nui-dateLayer-calendar table tbody tr td.nui-dateLayer-calendar-todayCell b {
  152.       color: white !important;
  153.     }
  154.     div#dvContainer div.frame-main-cont-body.nui-scroll div.js-component-layer.nui-dateLayer.nui-layer div.nui-dateLayer-calendar table tbody tr td b {
  155.       color: #7d90a9 !important;
  156.     }
  157.     div#dvContainer div.tv0 div.nui-txt-flag0 {
  158.       color: #8f8f8f;
  159.     }
  160.     div#dvContainer div.tv0 div.nui-txt-flag0 div {
  161.       background-color: #000;
  162.     }
  163.     div#dvContainer div.tv0 div.nui-txt-flag0 div div.gB0 label.nui-chk.cS0 span {
  164.       background-color: #272727;
  165.       border-color: #252525;
  166.     }
  167.     div#dvContainer div.nui-btnGroup div.js-component-button.nui-roundBtn.nui-btn.nui-btn-hasIcon.nui-roundBtn-hasIcon.nui-btn-disabled.nui-roundBtn-disabled span {
  168.       background-color: #1e1e1e !important;
  169.       border-color: #252525 !important;
  170.       color: #8f8f8f !important;
  171.     }
  172.     div#dvContainer div.nui-btnGroup div.js-component-button.nui-roundBtn.nui-btn.nui-btn-hasIcon.nui-roundBtn-hasIcon span {
  173.       background-color: #272727 !important;
  174.       border-color: #252525 !important;
  175.       color: #cdcdcd !important;
  176.     }
  177.     div#dvContainer div.frame-main.frame-main-noNav header.frame-main-cont-head div.nui-toolbar-ext div a {
  178.       color: #7d90a9 !important;
  179.     }
  180.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll header {
  181.       background-color: #000;
  182.       color: #8f8f8f;
  183.     }
  184.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll header div.kZ0 {
  185.       color: #8f8f8f;
  186.     }
  187.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll header div.kZ0 label.fn0 a {
  188.       color: #7d90a9 !important;
  189.     }
  190.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll header div.kZ0 div.dG0 {
  191.       background-color: #000;
  192.       color: #cdcdcd;
  193.     }
  194.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll header div.kZ0 div.dG0 div input {
  195.       color: #cdcdcd;
  196.     }
  197.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll header div.dc2 div.kZ0 div.bz0 div.js-component-input.nui-ipt {
  198.       background-color: #1e1e1e !important;
  199.       border-color: #252525;
  200.     }
  201.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll header div.dc2 div.kZ0 div.bz0 div.js-component-select.nui-select.nui-select-disabled {
  202.       background-color: #000 !important;
  203.       border-color: #252525 !important;
  204.     }
  205.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll header div.dc2 div.kZ0 div.bz0 div.js-component-select.nui-select.nui-select-disabled div.js-component-input.nui-ipt.nui-ipt-disabled {
  206.       background-color: #000 !important;
  207.     }
  208.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll header div.dc2 div.kZ0 div.bz0 div.js-component-select.nui-select.nui-select-disabled div.js-component-input.nui-ipt.nui-ipt-disabled input {
  209.       color: #8f8f8f !important;
  210.     }
  211.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll header div.dc2 div.kZ0 div.bz0 div.js-component-select.nui-select {
  212.       background-color: #1e1e1e !important;
  213.       border-color: #252525 !important;
  214.     }
  215.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll header div.dc2 div.kZ0 div.bz0 div.js-component-select.nui-select div.js-component-input.nui-ipt {
  216.       background-color: #1e1e1e !important;
  217.     }
  218.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll header div.dc2 div.kZ0 div.bz0 input {
  219.       color: #cdcdcd;
  220.     }
  221.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic {
  222.       background-color: #252525;
  223.       border-color: #252525;
  224.     }
  225.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar {
  226.       background-color: #1e1e1e;
  227.       border-color: #252525;
  228.     }
  229.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-btn.APP-editor-btn-spln {
  230.       background-color: #252525;
  231.       width: 2px;
  232.     }
  233.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-btn.APP-editor-btn-dis:after {
  234.       background-color: #1e1e1e;
  235.     }
  236.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-btn.APP-editor-btn-dis span b {
  237.       background-image: none;
  238.     }
  239.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-btn.APP-editor-commond-btn b, div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-commond-btn b {
  240.       background-color: #1e1e1e;
  241.     }
  242.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-btn.APP-editor-commond-btn b:hover, div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-commond-btn b:hover {
  243.       background-color: #272727;
  244.     }
  245.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-btn.APP-editor-commond-btn span, div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-commond-btn span {
  246.       background-color: #1e1e1e;
  247.     }
  248.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-btn.APP-editor-commond-btn span:hover, div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-commond-btn span:hover {
  249.       background-color: #272727;
  250.     }
  251.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-btn.APP-editor-commond-btn span b, div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-commond-btn span b {
  252.       background-color: #1e1e1e;
  253.       border-color: #252525;
  254.     }
  255.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-btn.APP-editor-commond-btn span b:hover, div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-tbar a.APP-editor-commond-btn span b:hover {
  256.       background-color: #272727;
  257.     }
  258.     div#dvContainer div.frame-main.frame-main-noNav div.frame-main-cont-body.nui-scroll section div.APP-editor.APP-editor-basic div.APP-editor-edtr iframe.APP-editor-iframe {
  259.       filter: invert(1);
  260.     }
  261.     div#dvSubContainer div.frame-main.columns-lr-view {
  262.       background-color: #1e1e1e;
  263.     }
  264.     div#dvSubContainer div.frame-main.columns-lr-view header {
  265.       background-color: #1e1e1e;
  266.       border-color: #252525;
  267.     }
  268.     div#dvSubContainer div.frame-main.columns-lr-view header div {
  269.       color: #8f8f8f;
  270.       background-color: #272727;
  271.       border-color: #252525;
  272.     }
  273.     div#dvSubContainer div.frame-main-cont-body.nui-scroll {
  274.       background-color: #1e1e1e;
  275.       border-color: #252525;
  276.     }
  277.     div#dvSubContainer div.frame-main-cont-body.nui-scroll section div.nui-simpleTree.nui-tree div div span:hover {
  278.       background-color: #272727;
  279.     }
  280.     /* 移动端界面 */
  281.     div.js-component-menu.menu {
  282.       background-color: #272727;
  283.     }
  284.     div.js-component-menu.menu div.js-component-menuitem.menu-item {
  285.       background-color: #272727;
  286.       border-color: #252525;
  287.       color: #cdcdcd;
  288.     }
  289.     div.js-component-button.btn-normal2 {
  290.       background-color: #1e1e1e;
  291.       box-shadow: none;
  292.       border-color: #252525;
  293.       border-width: 1px;
  294.       color: #1e1e1e;
  295.     }
  296.     div.js-component-button.btn-normal2 span.btn-inner {
  297.       color: #8f8f8f;
  298.       border-color: #252525;
  299.       background-image: linear-gradient(#272727, #272727);
  300.     }
  301.     div.js-component-button.btn-main {
  302.       background-color: #0e5500;
  303.       background-image: none;
  304.       border-color: #252525;
  305.       color: #1e1e1e;
  306.     }
  307.     div.js-component-button.btn-main span.btn-inner {
  308.       color: #cdcdcd;
  309.       border-color: #252525;
  310.       background-color: #0e5500;
  311.       background-image: none;
  312.     }
  313.     div.js-component-input.ipt-multiLine.ipt {
  314.       background-image: linear-gradient(#272727, #272727);
  315.       box-shadow: none;
  316.       border-color: #1e1e1e;
  317.       border-width: 1.5px;
  318.       color: #1e1e1e;
  319.     }
  320.     div.js-component-input.ipt-multiLine.ipt label {
  321.       color: #8f8f8f;
  322.     }
  323.     div.frame div.frame-top {
  324.       background-color: #000;
  325.       color: #8f8f8f;
  326.     }
  327.     div.frame div.frame-nav, div.frame div.frame-main {
  328.       background-color: #272727;
  329.       color: #8f8f8f;
  330.     }
  331.     div.frame div.frame-nav h2.subject, div.frame div.frame-main h2.subject {
  332.       color: #cdcdcd;
  333.     }
  334.     div.frame div.frame-nav div.inputBar.mInbox-searchBar, div.frame div.frame-main div.inputBar.mInbox-searchBar {
  335.       background-color: #1e1e1e;
  336.       color: #8f8f8f;
  337.     }
  338.     div.frame div.frame-nav div.inputBar.mInbox-searchBar div.mInbox-searchBar-inner div.ipt.bdr-cFocus, div.frame div.frame-main div.inputBar.mInbox-searchBar div.mInbox-searchBar-inner div.ipt.bdr-cFocus {
  339.       background-color: #272727;
  340.       color: #8f8f8f;
  341.     }
  342.     div.frame div.frame-nav div.frame-toolbar, div.frame div.frame-main div.frame-toolbar {
  343.       background-color: #1e1e1e !important;
  344.       border-color: #1e1e1e !important;
  345.       color: #1e1e1e !important;
  346.     }
  347.     div.frame div.frame-nav div.js-component-toolbar, div.frame div.frame-main div.js-component-toolbar {
  348.       background-color: #1e1e1e !important;
  349.       background-image: none !important;
  350.       border-color: #1e1e1e !important;
  351.       color: #cdcdcd;
  352.     }
  353.     div.frame div.frame-nav div.js-component-toolbar div.toolbar-optItem, div.frame div.frame-main div.js-component-toolbar div.toolbar-optItem {
  354.       background-color: transparent;
  355.       color: #cdcdcd;
  356.     }
  357.     div.frame div.frame-nav div.scroll, div.frame div.frame-main div.scroll {
  358.       background-color: #272727;
  359.       color: #8f8f8f;
  360.     }
  361.     div.frame div.frame-nav div.scroll div.js-component-component, div.frame div.frame-main div.scroll div.js-component-component {
  362.       background-color: #1e1e1e;
  363.       color: #8f8f8f;
  364.     }
  365.     div.frame div.frame-nav div.scroll div.g-null::after, div.frame div.frame-main div.scroll div.g-null::after {
  366.       background-color: #272727;
  367.       color: #8f8f8f;
  368.     }
  369.     div.js-component-msgbox div.toolbar-colCenter {
  370.       background-color: #1e1e1e;
  371.       color: #cdcdcd;
  372.     }
  373.     div.mask.mCompose-wrapper {
  374.       background-color: #272727;
  375.     }
  376.     div.mask.mCompose-wrapper div.msgbox.mCompose {
  377.       background-color: #272727;
  378.       color: #8f8f8f;
  379.     }
  380.     div.mask.mCompose-wrapper div.msgbox.mCompose div#composeContentArea {
  381.       color: #8f8f8f;
  382.     }
  383.     div.mask.mCompose-wrapper div.msgbox.mCompose div.js-component-toolbar {
  384.       background-color: #1e1e1e !important;
  385.       background-image: none !important;
  386.       border-color: #1e1e1e !important;
  387.       color: #cdcdcd;
  388.     }
  389.     div.mask.mCompose-wrapper div.msgbox.mCompose div.js-component-toolbar div.toolbar-optItem {
  390.       background-color: transparent;
  391.       color: #cdcdcd;
  392.     }
  393.     div.mask.mCompose-wrapper span.mCompose-item-frome-name {
  394.       color: #cdcdcd;
  395.     }
  396.     div.mask.mCompose-wrapper input.ipt-input {
  397.       color: #cdcdcd;
  398.     }
  399.     div.list-item, div.list-item-unread.list-item {
  400.       background-color: #272727 !important;
  401.       border-color: #252525 !important;
  402.     }
  403.     div.list-item span.mail-list-subject, div.list-item-unread.list-item span.mail-list-subject {
  404.       color: #cdcdcd;
  405.     }
  406.     div.list-item span.mail-list-frome, div.list-item span.mail-list-time, div.list-item-unread.list-item span.mail-list-frome, div.list-item-unread.list-item span.mail-list-time {
  407.       color: #8f8f8f;
  408.     }
  409.     div.js-component-msgbox.msgbox-simple.msgbox {
  410.       background-color: #1e1e1e;
  411.     }
  412.     div.js-component-msgbox.msgbox-simple.msgbox div.msgbox-hd {
  413.       background-color: #1e1e1e;
  414.       color: #cdcdcd;
  415.     }
  416.     div.js-component-msgbox.msgbox-simple.msgbox div.msgbox-bd {
  417.       background-color: #1e1e1e;
  418.       color: #8f8f8f;
  419.     }
  420.     /* 移除多余的元素 */
  421.     div.list-item.list-item-sptln {
  422.       display: none;
  423.     }
  424.   }
  425. }
  426.  
  427. /*# sourceMappingURL=126-mail-darkmode.css.map */

欢迎访问Greasy Fork镜像

土豆服务器，请按需使用

镜像地址随时可能被墙，建议加群获取最新地址

加入Q群

QingJ © 2025

镜像随时可能失效，请加Q群300939539或关注我们的公众号极客氢云获取最新地址