喜欢的话，就分享给其他小伙伴吧
bilibili Dark Theme by y-64
Mirrored from https://raw.githubusercontent.com/y-64/bilibili-Dark-Theme/main/bilibili-Dark-Theme.user.styl
Details
Authory-64
LicenseGPL-3.0
Categorybilibili
Created
Updated
Size53 kB
Statistics
Learn how we calculate statistics in the FAQ.
Failed to fetch stats.
Description
Notes
隐藏了已发现的占位广告
略微降低了页面整体亮度（4%）
已全面放弃对旧版页面的支持
如有建议与反馈，或者有希望新增的页面就告诉我吧
Source code
Source code has over 10K characters, so we truncated it. You can inspect the full source code on install link./* ==UserStyle==
@name bilibili Dark Theme
@namespace y-64
@version 1.25.0207.1
@description A dark theme for bilibili.com
@author y-64
@license GPL-3.0
@preprocessor stylus
==/UserStyle== */
@-moz-document regexp("^https?://(?:[^\/.]+\.)*bilibili\.com/.*") {
:root {
--b-Wh0: #FFFFFF;
--b-Ga0: #F6F7F8;
--b-Ga1: #F1F2F3;
--b-Ga2: #E3E5E7;
--b-Ga3: #C9CCD0;
--b-Ga3-rgb: 201, 204, 208;
--b-Ga4: #AEB3B9;
--b-Ga5: #9499A0;
--b-Ga6: #797F87;
--b-Ga7: #61666D;
--b-Ga7p50: #545960;
--b-Ga8: #484C53;
--b-Ga8p50: #3C3F46;
--b-Ga8p75: #35383F;
--b-Ga9: #2F3238;
--b-Ga9-rgb: 47, 50, 56;
--b-Ga9p25: #292C31;
--b-Ga9p50: #24262A;
--b-Ga9p75: #1E1F23;
--b-Ga9p75-rgb: 30, 31, 35;
--b-Ga10: #18191C;
--b-Ba0: #000000;
--b-Pi2: #FFD9E4;
--b-Pi3: #FFB3CA;
--b-Pi4: #FF8CB0;
--b-Pi5: #FF6699;
--b-Pi6: #E84B85;
--b-Or3: #FFC18F;
--b-Or4: #FFA058;
--b-Or5: #FF7F24;
--b-Or6: #E95B03;
--b-Gr2: #CAF1D6;
--b-Gr3: #95E4AF;
--b-Gr4: #5FD689;
--b-Gr5: #2AC864;
--b-Cy2: #C4EFF0;
--b-Cy3: #89E1E1;
--b-Cy4: #4FD3D1;
--b-Cy5: #14C4BF;
--b-Lb2: #BFEDFA;
--b-Lb3: #80DAF6;
--b-Lb4: #40C5F1;
--b-Lb5: #00AEEC;
--b-Lb5p50: #009CD8;
--b-Lb6: #008AC5;
--b-Pu2: #EDDBFF;
--b-Pu3: #D8B6FF;
--b-Pu4: #C392FF;
--b-Pu5: #AC6DFF;
--b-Si5: #AFC0D5;
--b-Si6: #8D9FB9;
--b-Si7: #6D7F9C;
--b-Si8: #4D5D7C;
--bg1u: var(--b-Ga9p75);
--bg1u-rgb: var(--b-Ga9p75-rgb);
--bg2u: var(--b-Ga9);
--bg2u-rgb: var(--b-Ga9-rgb);
--bg2p25: var(--b-Ga9p25);
--bg2p50: var(--b-Ga9p50);
--bg3u: var(--bg2u);
--bg4u: var(--b-Ga8p50);
--bg5u: var(--b-Ga8);
--text0u: var(--b-Ga2);
--text1u: var(--b-Ga4);
--text2u: var(--b-Ga5);
--text3u: var(--b-Ga6);
--text4u: var(--b-Ga7);
--text5u: var(--b-Ga8);
--trans: transparent;
--trans-hov: transparent;
--fff: var(--b-Wh0);
--fff-hov: var(--b-Wh0);
--iwh: var(--b-Ga1);
--iwh-hov: var(--b-Ga0);
--bbl3: var(--b-Lb3);
--bbl5-hov: var(--b-Lb4);
--bbl5: var(--b-Lb5);
--bbl6: var(--b-Lb6);
--bpi3: var(--b-Pi3);
--bpi5-hov: var(--b-Pi4);
--bpi5: var(--b-Pi5);
--bpi6: var(--b-Pi6);
--bor4: var(--b-Or4);
--bor4-hov: var(--b-Or3);
--bor5: var(--b-Or5);
--bg2-hov: var(--bg4);
--bg4-hov: var(--bg5);
--bg4-bl: var(--bg4);
--bg5-hov: var(--bg6);
--bg6: var(--b-Ga6);
--text0: var(--text0u);
--text1-hov: var(--text0);
--text2-hov: var(--text1);
--text3-hov: var(--text2);
--text4-hov: var(--text3);
--none-s: none;
--trans-s: 1px solid transparent;
--trans-s-hov: 1px solid transparent;
--bg1-s: 1px solid var(--bg1);
--bg2-s: 1px solid var(--bg2);
--bg2-s-hov: 1px solid var(--bg2-hov);
--bg2-2s: 2px solid var(--bg2);
--bg4-s: 1px solid var(--bg4);
--bg4-s-hov: 1px solid var(--bg4-hov);
--bg4-2s: 2px solid var(--bg4);
--bg5-s: 1px solid var(--bg5);
--bg5-s-hov: 1px solid var(--bg5-hov);
--text1-s: 1px solid var(--text1);
--text2-s: 1px solid var(--text2);
--text2-s-hov: 1px solid var(--text2-hov);
--text2-2s: 2px solid var(--text2);
--text2-2s-hov: 2px solid var(--text2-hov);
--text3-s: 1px solid var(--text3);
--text4-s: 1px solid var(--text4);
--text4-s-hov: 1px solid var(--text4-hov);
--text5-s: 1px solid var(--text5);
--bbl5-s: 1px solid var(--bbl5);
--bbl5-s-hov: 1px solid var(--bbl5-hov);
--bbl5-2s: 2px solid var(--bbl5);
--bbl5-2s-hov: 2px solid var(--bbl5-hov);
--bpi5-s: 1px solid var(--bpi5);
--bpi5-2s: 2px solid var(--bpi5);
--bpi5-2s-hov: 2px solid var(--bpi5-hov);
--bor4-s: 1px solid var(--bor4);
--bor4-s-hov: 1px solid var(--bor4-hov);
--bor5-s: 1px solid var(--bor5);
--shadow-popup: 0px 0px 10px rgba(0, 0, 0, 0.5);
--ra-zero: 0;
--ra-btn-md: 8px;
--ra-btn-rd: 100px;
--ra-popup-rt: 6px;
--ra-popup-rd: 12px;
--ra-popup-sp: 16px;
--ra-tag: 4px;
}
bgnb(bgc, border=bgc) {
background-color: var(bgc) !important;
border-color: var(border) !important;
}
btn(bgc, color, border, colorHov=false, borderHov=false) {
background-color: var(bgc) !important;
border: var(border) !important;
color: var(color) !important;
box-shadow: none !important;
transition: all .3s ease;
&:hover {
background-color: var(bgc+-hov) !important;
border: var(borderHov||border+-hov) !important;
color: var(colorHov||color+-hov) !important;
}
}
btnRd(bgc, color, border) {
btn(bgc, color, border);
border-radius: var(--ra-btn-rd) !important;
}
btnRs() {
border-radius: var(--ra-btn-md) !important;
line-height: normal !important;
height: auto !important;
width: auto !important;
padding: 5px 16px !important;
}
tag(bgc, color, border, radius=--ra-tag) {
background-color: var(bgc) !important;
border: var(border) !important;
border-radius: var(radius) !important;
color: var(color) !important;
height: auto !important;
padding: 0px 5px !important;
}
tagT(color) {
tag(--trans, color, color+-s);
}
popupBox(bgc, borderColor, radius, shadow) {
background-color: var(bgc) !important;
border-color: var(borderColor) !important;
border-radius: var(radius) !important;
box-shadow: var(shadow) !important;
}
pb(radius, color=--bg2u) {
popupBox(color, --trans, --ra-popup+radius, --shadow-popup);
}
pbTrans() {
popupBox(--trans, --trans, --ra-popup-rt, --trans);
}
.banner-content,
html,
img {
filter: brightness(0.96);
}
}
@-moz-document regexp("^https?://((?!account|app|cool|jobs|link|live|love|member|play-live|passport|pay|show)(?:[^\/.]+\.)*)bilibili\.com/(?!audio|blackboard|festival|watchroom|v/(customer-service|pay|virtual)).*") {
:root {
--Ga1: var(--bg3);
--Ga2: var(--line_regular);
--Ga9: var(--text1);
--Ga10: var(--text1);
--Ga11: var(--bg1);
--Pi10_u: var(--b-Pi3);
--bg1: var(--bg1u);
--bg1_rgb: var(--bg1u-rgb);
--bg2: var(--bg2u);
--bg3: var(--bg2);
--bg4: var(--bg4u);
--bg5: var(--bg5u);
--bg1_float: var(--bg2);
--v_bg1_float: var(--bg1);
--bg1_float_rgb: var(--bg1_rgb);
--bg2_float: var(--bg3);
--text1: var(--text1u);
--text2: var(--text2u);
--text3: var(--text3u);
--text4: var(--text4u);
--text5: var(--text5u);
--text_link: var(--b-Lb5p50);
--line_light: var(--bg3);
--line_regular: var(--b-Ga8p75);
--line_bold: var(--text4);
--graph_bg_bright: var(--bg1);
--graph_bg_thin: var(--bg2);
--graph_bg_thin_rgb: var(--bg2u-rgb);
--graph_bg_thin_float: var(--bg2);
--graph_bg_regular: var(--bg3);
--graph_bg_regular_float: var(--bg4);
--graph_bg_thick: var(--bg4);
--graph_bg_tick: var(--bg4);
--graph_weak: var(--text3);
--graph_medium: var(--text3);
--graph_bold: var(--text2);
--graph_icon: var(--text2);
--bpx-dmsend-hint-icon: var(--text3);
--bpx-tooltip-color: var(--text0u);
color-scheme: dark;
}
[class^="_VideoAs"] {
--app_graph_bg: var(--bg5) !important;
}
iframe {
color-scheme: initial;
}
*:not(html):not(body) {
&::-webkit-scrollbar {
width: 6px !important;
}
&::-webkit-scrollbar-thumb {
background-color: var(--bg5) !important;
border-radius: var(--ra-btn-rd) !important;
}
}
input,
#app input,
#app ~ div input,
textarea,
#app textarea,
#app ~ div textarea {
background-color: transparent;
color: var(--text1);
caret-color: var(--text1);
&::placeholder {
color: var(--text3);
}
}
.fixed-header-nav-shown,
.bili-dyn-sidebar__btn,
.bili-radio__inner,
body {
background-color: var(--bg1);
}
.bili-header .slide-down,
.header-channel,
.search-fixed-header,
.mini-header,
.fixed .main-breadcrums {
background-color: var(--bg1) !important;
box-shadow: var(--shadow-popup) !important;
}
.history-item,
#i_cecream .primary-btn:not(:hover),
.watchlater-pip-button-inner:not(:hover),
.floor-card-inner:not(:hover),
.bili-footer {
background-color: var(--bg1) !important;
}
.vui_button--link:hover,
.up-info__btn-panel .upinfo-btn-panel .default-btn,
.normal-base-item .cover {
background-color: var(--bg2);
}
.search-input .clear-icon,
.up-avatar,
.pic-box,
.b-img.sleepy,
.dropdown-top {
background: var(...