【css美化】macOS Sonoma 柔和UI主题（浅色）

macOS Sonoma 柔和UI主题（浅色）

 
此主题特点简介
这是两套 「悬浮式应用 (Floating App)」 风格的 CSS 主题。
 
它们都抛弃了传统网页的文档流布局，转而使用半透明面板、柔和阴影和系统性圆角，来营造一个轻盈、富有层次感、类似现代桌面操作系统（如 macOS）的应用界面。
 

「Aura Translucent」主题（半透明）：

  此主题构建了一个轻盈、通透、悬浮的现代软体界面。
  放弃了「Aetherium Glass」中的「毛玻璃」模糊效果，转而完全依赖「半透明度」和「柔和阴影」来构建层次感。这种风格更加简洁，对性能更友好，视觉上给人一种「轻快」、「干净」的悬浮感
 

「Aetherium Glass」主题（毛玻璃）：

  这份 CSS 主题将网页转变为一个精致、轻盈且富有现代感的操作界面，其核心风格是 「Glassmorphism」（玻璃拟态） 与 「悬浮式 App 布局」 的完美结合。
  它给人的第一印像是「清澈」和「漂浮」，更像是一个运行在桌面上的独立应用程式（如 macOS 或 Windows 11 的现代界面），而不是一个传统的网页。
 
 

特别感谢原作者：Mayi

基于 @Mayi 的源码二次修改~在此也要感谢 Mayi ！
原贴：站内美化扩展css-深色模式液态玻璃（高斯模糊）
 
 

核心特点：

• 「Aura Translucent」-- 「半透明」面板，柔和阴影带来的轻快层次感
• 「Aetherium Glass」 -- 标志性的「毛玻璃」材质，模糊的背景，半透明感的面板，玻璃边缘微妙高光特效
• 柔和的「悬浮式」UI -- 柔和的层次阴影，一致的圆角
• 丰富的悬停微感交互 -- 悬浮面板视觉，鼠标接触反馈
• 高度统一的细节定制 -- 统一的品牌色调，完全沉浸式的主题体验
   
   

碎碎念：

• 主题只有浅色 -- 由于NS与DF都把自定义css的最大字符限制在7731，所以暗色主题与移动端主题实在放不进css，遗憾
• 不知道什么时候才能把自定义css的最大字符改回原本 @酒神，之前大佬们制作的css多数都超了字符上限，现在相当已无法导入全作废了。
   
   

「Aura Translucent」主题（半透明）：

更新了新配色「兰花紫」 修复了许多配色细节bug。
 

 
CSS代码：

:root {
--main-color:#B054B0 !important;
--sub-color:#9163B4 !important;
--link-color:#404040 !important;
--link-hover-color:#B054B0 !important;
--link-visited-color:#636d75 !important;
--r-s:10px !important;
--r-m:16px !important;
--r-l:20px !important;
--s-m:0 8px 32px #0000001a;
--s-h:0 16px 40px #0000001f;
--s-c:0 4px 12px #0000001a;
--cur-1:;
}
.avatar {border:3px solid #555 !important;transition:all 0.3s ease-in-out}
.avatar:hover {border-color:#999 !important;box-shadow:0 0 15px #8ab4f866}
.avatar-normal,
.sorter,
.btn {box-shadow:var(--s-c) !important;transition:all 0.3s ease-in-out}
.avatar-normal:hover,
.sorter:hover,
.btn:hover {box-shadow:0 6px 18px #00000033, 0 0 10px #8ab4f84d !important;transform:translateY(-2px)}
.avatar-normal {border-radius:24px;height:48px;width:48px}
.topic-carousel-panel[data-v-8db19fce] {min-height:66px !important}

::-webkit-scrollbar {width:8px;height:0}
::-webkit-scrollbar-track {background-color:transparent}
::-webkit-scrollbar-thumb {background-color:#B054B0D0;border-radius:2em;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover {background-color:#B054B0}

* {cursor:url(https://npm.elemecdn.com/kang-static/Hexo/img/default.cur), auto !important}

img,
a:hover,
button:hover,
i:hover,
svg:hover,
.transition:hover {cursor:url('https://npm.elemecdn.com/kang-static/Hexo/img/pointer.cur'), auto !important}

header .site-title {font-size:32px;font-weight:700;margin-right:16px;margin-top:6px}
header .beta-icon {color:#555}
header div.history-dropdown-on,
header div.color-theme-switcher {color:#444 !important}
header .search-box #search-site2 {border-radius:var(--r-l)}
.pure-form input[type=text] {border:1px solid #B054B0}

body::before {
content:"";
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
z-index:-1;
background:url(https://cdn.nodeimage.com/i/m5lQ9CA9IZKIBAyaUOUxqnoQwiCB4AxM.webp) center/cover no-repeat;
overflow-x:hidden;
}

body>header {
left:50%;
position:fixed;
top:0;
width:98%;
z-index:10;
transform:translateX(-50%);
border-radius: 0 0 var(--r-l) var(--r-l) !important;
}
#nsk-frame{margin:40px auto 0 auto !important}
footer {left:50%;width:98%;transform:translateX(-50%)}
#nsk-body,
header,
footer {
background-color:#f1f4f5b3 !important;
border:1px solid #f0f0f066 !important;
border-radius:var(--r-l) !important;
box-shadow:var(--s-m) !important;
transition:all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
header:hover,
footer:hover {box-shadow:var(--s-h) !important;border-color:#ffffff33 !important;transform:translateX(-50%) translateY(-4px)}
.contain {justify-content:space-evenly;padding:0 20px}
footer .col ul li {color:#555}
footer .col .group-head-link {color:#B054B0}
#nsk-left-panel-container .category-list {background-color:#f1f4f5b3}
#nsk-body-left .sorter>a.selected {background-color:#B054B0}
#nsk-body:hover {transform:translateY(-4px);box-shadow:var(--s-h) !important;border-color:#ffffff33 !important}

body,
#nsk-body,
header,
footer {color:#555 !important}
a {text-decoration:none;transition:color 0.3s ease}
.post-list .post-title a:visited {color:#888}
.post-list topic-carousel-panel {min-height:60px}
.user-card .user-stat[data-v-9796effc] {
background-color:#e8f3ff80 !important;
padding:20px;
border-radius:var(--r-m) !important;
box-shadow:var(--s-c) !important;
}
#nsk-right-panel-container .nsk-panel {
background-color:#e8f3ff80 !important;
border-radius:var(--r-m) !important;
box-shadow:var(--s-c) !important;
padding:10px 10px;
margin:0 0 18px;
}

.btn {background-color:#B054B0 !important;border-radius:var(--r-l) !important}
.btn:hover {background-color:#55adff !important;transform:scale(1.05)}
.nsk-pager .pager-next,
.nsk-pager .pager-pos,
.nsk-pager .pager-prev {border-radius:var(--r-s) !important}
.nsk-pager .pager-pos.pager-cur {background-color:#B054B0 !important;color:#fff !important}
#nsk-body-left .post-list .post-list-item .post-category {
background:#B054B0 !important;
border-radius:var(--r-s) !important;
padding:0 8px;
color:#eee;
box-shadow:0 0 4px #00000080;
}
.nav-item-btn{background-color: #f1f4f5b3 !important}
.topic-carousel-index-item[data-v-8db19fce] {background-color:#0000004d}
.current-carousel-index-item[data-v-8db19fce] {background-color:#000000cc}
#nsk-body-left .sorter {border:0px;border-radius:var(--r-m) !important}
#nsk-left-panel-container .category-list {
border-radius:var(--r-m) !important;
background-color:#f1f4f5b3 !important;
box-shadow:var(--s-m) !important;
transition:all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
#nsk-left-panel-container .category-list:hover {
transform:translateY(-4px);
box-shadow:var(--s-h) !important;
border-color:#ffffff33 !important;
}
#nsk-left-panel-container .category-list a {color:#000}
#nsk-left-panel-container .category-list .current-category a,
#nsk-left-panel-container .category-list a:hover {background:#B054B0;color:#fff}

.expression[data-v-36aaec63] {background-color:#eee;color:#333}
.head-container[data-v-18f8c01b],
.selector[data-v-18f8c01b],
.selector[data-v-159d7f8b],
.head-container[data-v-159d7f8b],
.member-list[data-v-c602bc02] {
-webkit-backdrop-filter: blur(0px) !important;
backdrop-filter: blur(0px) !important;
background-color:#f1f4f5b3 !important;
border:1px solid #f0f0f066 !important;
border-radius:var(--r-m) !important;
box-shadow:var(--s-m) !important;
transition:all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.head-container[data-v-18f8c01b]:hover,
.selector[data-v-18f8c01b]:hover,
.selector[data-v-159d7f8b]:hover,
.head-container[data-v-159d7f8b]:hover {box-shadow:var(--s-h) !important;transform:translateY(-2px)}
.selector .selected[data-v-159d7f8b],
.selector .selected[data-v-159d7f8b]:hover {color:#B054B0 !important}
.nsk-post-wrapper .award-corner .corner-triangle {border-top-left-radius:var(--r-m) !important}
.carousel-mask[data-v-8db19fce] {
background:linear-gradient(to right, transparent, #B054B0 200%, #B054B0) !important;
border-radius: 0 16px 16px 0;
min-height:64px !important;
width:40px !important;
}
.expression[data-v-467a77e4] {color:#555}
.topic-select .submit[data-v-467a77e4] {border-radius:20px}
.user-card .user-stat a[data-v-9796effc]:hover {color:#888}
.post-list-controler,
.nsk-pager,
.post-list-item {
border-radius:var(--r-m) !important;
transition:all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
margin-bottom:4px !important;
position:relative;
}
.post-list-item:hover {
background-color:#e8f3ff80 !important;
border:1px solid #f0f0f066 !important;
box-shadow:var(--s-c) !important;
transform:translateY(-2px);
}
.topic-carousel-panel[data-v-8db19fce]:hover .post-list-item:hover {box-shadow:none !important}
table tr {color:#333}
.reply-item[data-v-eac5d81a] {color:#333 !important}
.post-content code, .post-content pre {background:#ffffcc !important}
pre:has(> code[data-highlighted="yes"].hljs){
position:relative;
max-height:300px;
overflow:hidden;
transition:max-height 0.5s ease-in-out;
}
pre:has(> code[data-highlighted="yes"].hljs)::after{
content:'';
position:absolute;
bottom:0;
left:0;
width:100%;
height:60px;
background:linear-gradient(to bottom, transparent 0%, #ffffcc 70%);
pointer-events:none;
transition:opacity 0.3s ease;
opacity:1;
}
pre:has(> code[data-highlighted="yes"].hljs):hover{max-height:1000vh}
pre:has(> code[data-highlighted="yes"].hljs):hover::after{opacity:0;visibility:hidden}
.comment-menu .menu-item[data-v-254da704]{color: #555 !important}
.comment-menu .menu-item[data-v-254da704]:hover{color: #B054B0 !important}
.user-card .user-stat a[data-v-9796effc]:hover{color: #B054B0 !important;}

 
 
更新了代码「深空蓝」 修复了许多配色细节bug。
 
 

 
CSS代码：

:root {
--main-color:#0084ff !important;
--sub-color:#55adff !important;
--link-color:#404040 !important;
--link-hover-color:#0084ff !important;
--link-visited-color:#636d75 !important;
--r-s:10px !important;
--r-m:16px !important;
--r-l:20px !important;
--s-m:0 8px 32px #0000001a;
--s-h:0 16px 40px #0000001f;
--s-c:0 4px 12px #0000001a;
--cur-1:;
}
.avatar {border:3px solid #555 !important;transition:all 0.3s ease-in-out}
.avatar:hover {border-color:#999 !important;box-shadow:0 0 15px #8ab4f866}
.avatar-normal,
.sorter,
.btn {box-shadow:var(--s-c) !important;transition:all 0.3s ease-in-out}
.avatar-normal:hover,
.sorter:hover,
.btn:hover {box-shadow:0 6px 18px #00000033, 0 0 10px #8ab4f84d !important;transform:translateY(-2px)}
.avatar-normal {border-radius:24px;height:48px;width:48px}
.topic-carousel-panel[data-v-8db19fce] {min-height:66px !important}

::-webkit-scrollbar {width:8px;height:0}
::-webkit-scrollbar-track {background-color:transparent}
::-webkit-scrollbar-thumb {background-color:#0084ffD0;border-radius:2em;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover {background-color:#0084ff}

* {cursor:url(https://npm.elemecdn.com/kang-static/Hexo/img/default.cur), auto !important}

img,
a:hover,
button:hover,
i:hover,
svg:hover,
.transition:hover {cursor:url('https://npm.elemecdn.com/kang-static/Hexo/img/pointer.cur'), auto !important}

header .site-title {font-size:32px;font-weight:700;margin-right:16px;margin-top:6px}
header .beta-icon {color:#555}
header div.history-dropdown-on,
header div.color-theme-switcher {color:#444 !important}
header .search-box #search-site2 {border-radius:var(--r-l)}
.pure-form input[type=text] {border:1px solid #0084ff}

body::before {
content:"";
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
z-index:-1;
background:url(https://cdn.nodeimage.com/i/njXZlwmVDytD7ts138dOv9IkY2QkwPCQ.webp) center/cover no-repeat;
overflow-x:hidden;
}

body>header {
left:50%;
position:fixed;
top:0;
width:98%;
z-index:10;
transform:translateX(-50%);
border-radius: 0 0 var(--r-l) var(--r-l) !important;
}
#nsk-frame{margin:40px auto 0 auto !important}
footer {left:50%;width:98%;transform:translateX(-50%)}
#nsk-body,
header,
footer {
background-color:#f1f4f5b3 !important;
border:1px solid #f0f0f066 !important;
border-radius:var(--r-l) !important;
box-shadow:var(--s-m) !important;
transition:all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
header:hover,
footer:hover {box-shadow:var(--s-h) !important;border-color:#ffffff33 !important;transform:translateX(-50%) translateY(-4px)}
.contain {justify-content:space-evenly;padding:0 20px}
footer .col ul li {color:#555}
footer .col .group-head-link {color:#0084ff}
#nsk-left-panel-container .category-list {background-color:#f1f4f5b3}
#nsk-body-left .sorter>a.selected {background-color:#0084ff}
#nsk-body:hover {transform:translateY(-4px);box-shadow:var(--s-h) !important;border-color:#ffffff33 !important}

body,
#nsk-body,
header,
footer {color:#555 !important}
a {text-decoration:none;transition:color 0.3s ease}
.post-list .post-title a:visited {color:#888}
.post-list topic-carousel-panel {min-height:60px}
.user-card .user-stat[data-v-9796effc] {
background-color:#e8f3ff80 !important;
padding:20px;
border-radius:var(--r-m) !important;
box-shadow:var(--s-c) !important;
}
#nsk-right-panel-container .nsk-panel {
background-color:#e8f3ff80 !important;
border-radius:var(--r-m) !important;
box-shadow:var(--s-c) !important;
padding:10px 10px;
margin:0 0 18px;
}

.btn {background-color:#0084ff !important;border-radius:var(--r-l) !important}
.btn:hover {background-color:#55adff !important;transform:scale(1.05)}
.nsk-pager .pager-next,
.nsk-pager .pager-pos,
.nsk-pager .pager-prev {border-radius:var(--r-s) !important}
.nsk-pager .pager-pos.pager-cur {background-color:#0084ff !important;color:#fff !important}
#nsk-body-left .post-list .post-list-item .post-category {
background:#0084ff !important;
border-radius:var(--r-s) !important;
padding:0 8px;
color:#eee;
box-shadow:0 0 4px #00000080;
}
.nav-item-btn{background-color: #f1f4f5b3 !important}
.topic-carousel-index-item[data-v-8db19fce] {background-color:#0000004d}
.current-carousel-index-item[data-v-8db19fce] {background-color:#000000cc}
#nsk-body-left .sorter {border:0px;border-radius:var(--r-m) !important}
#nsk-left-panel-container .category-list {
border-radius:var(--r-m) !important;
background-color:#f1f4f5b3 !important;
box-shadow:var(--s-m) !important;
transition:all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
#nsk-left-panel-container .category-list:hover {
transform:translateY(-4px);
box-shadow:var(--s-h) !important;
border-color:#ffffff33 !important;
}
#nsk-left-panel-container .category-list a {color:#000}
#nsk-left-panel-container .category-list .current-category a,
#nsk-left-panel-container .category-list a:hover {background:#0084ff;color:#fff}

.expression[data-v-36aaec63] {background-color:#eee;color:#333}
.head-container[data-v-18f8c01b],
.selector[data-v-18f8c01b],
.selector[data-v-159d7f8b],
.head-container[data-v-159d7f8b],
.member-list[data-v-c602bc02] {
-webkit-backdrop-filter: blur(0px) !important;
backdrop-filter: blur(0px) !important;
background-color:#f1f4f5b3 !important;
border:1px solid #f0f0f066 !important;
border-radius:var(--r-m) !important;
box-shadow:var(--s-m) !important;
transition:all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.head-container[data-v-18f8c01b]:hover,
.selector[data-v-18f8c01b]:hover,
.selector[data-v-159d7f8b]:hover,
.head-container[data-v-159d7f8b]:hover {box-shadow:var(--s-h) !important;transform:translateY(-2px)}
.selector .selected[data-v-159d7f8b],
.selector .selected[data-v-159d7f8b]:hover {color:#0084ff !important}
.nsk-post-wrapper .award-corner .corner-triangle {border-top-left-radius:var(--r-m) !important}
.carousel-mask[data-v-8db19fce] {
background:linear-gradient(to right, transparent, #0084ff 200%, #0084ff) !important;
border-radius: 0 16px 16px 0;
min-height:64px !important;
width:40px !important;
}
.expression[data-v-467a77e4] {color:#555}
.topic-select .submit[data-v-467a77e4] {border-radius:20px}
.user-card .user-stat a[data-v-9796effc]:hover {color:#888}
.post-list-controler,
.nsk-pager,
.post-list-item {
border-radius:var(--r-m) !important;
transition:all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
margin-bottom:4px !important;
position:relative;
}
.post-list-item:hover {
background-color:#e8f3ff80 !important;
border:1px solid #f0f0f066 !important;
box-shadow:var(--s-c) !important;
transform:translateY(-2px);
}
.topic-carousel-panel[data-v-8db19fce]:hover .post-list-item:hover {box-shadow:none !important}
table tr {color:#333}
.reply-item[data-v-eac5d81a] {color:#333 !important}
.post-content code, .post-content pre {background:#ffffcc !important}
pre:has(> code[data-highlighted="yes"].hljs){
position:relative;
max-height:300px;
overflow:hidden;
transition:max-height 0.5s ease-in-out;
}
pre:has(> code[data-highlighted="yes"].hljs)::after{
content:'';
position:absolute;
bottom:0;
left:0;
width:100%;
height:60px;
background:linear-gradient(to bottom, transparent 0%, #ffffcc 70%);
pointer-events:none;
transition:opacity 0.3s ease;
opacity:1;
}
pre:has(> code[data-highlighted="yes"].hljs):hover{max-height:1000vh}
pre:has(> code[data-highlighted="yes"].hljs):hover::after{opacity:0;visibility:hidden}
.comment-menu .menu-item[data-v-254da704]{color: #555 !important}
.comment-menu .menu-item[data-v-254da704]:hover{color: #0084ff !important}
.user-card .user-stat a[data-v-9796effc]:hover{color: #0084ff !important;}

「Aetherium Glass」主题（毛玻璃）

 

 
CSS代码：

:root {
--main-color:#0084ff !important;
--sub-color:#55adff !important;
--link-color:#404040 !important;
--link-hover-color:#0084ff !important;
--link-visited-color:#636d75 !important;
--r-s:10px !important;
--r-m:16px !important;
--r-l:20px !important;
--s-m:0 8px 32px #0000001a;
--s-h:0 16px 40px #0000001f;
--s-c:0 4px 12px #0000001a;
--cur-1:;
}
.avatar {border:3px solid #555 !important;transition:all 0.3s ease-in-out}
.avatar:hover {border-color:#999 !important;box-shadow:0 0 15px #8ab4f866}
.avatar-normal,
.sorter,
.btn {box-shadow:var(--s-c) !important;transition:all 0.3s ease-in-out}
.avatar-normal:hover,
.sorter:hover,
.btn:hover {box-shadow:0 6px 18px #00000033, 0 0 10px #8ab4f84d !important;transform:translateY(-2px)}
.avatar-normal {border-radius:24px;height:48px;width:48px}
.topic-carousel-panel[data-v-8db19fce] {min-height:66px !important}

::-webkit-scrollbar {width:8px;height:0}
::-webkit-scrollbar-track {background-color:transparent}
::-webkit-scrollbar-thumb {background-color:#0084ffD0;border-radius:2em;border:2px solid transparent;background-clip:padding-box}
::-webkit-scrollbar-thumb:hover {background-color:#0084ff}

* {cursor:url(https://npm.elemecdn.com/kang-static/Hexo/img/default.cur), auto !important}

img,
a:hover,
button:hover,
i:hover,
svg:hover,
.transition:hover {cursor:url('https://npm.elemecdn.com/kang-static/Hexo/img/pointer.cur'), auto !important}

header .site-title {font-size:32px;font-weight:700;margin-right:16px;margin-top:6px}
header .beta-icon {color:#555}
header div.history-dropdown-on,
header div.color-theme-switcher {color:#444 !important}
header .search-box #search-site2 {border-radius:var(--r-l)}
.pure-form input[type=text] {border:1px solid #0084ff}

body::before {
content:"";
position:fixed;
top:0;
left:0;
width:100%;
height:100%;
z-index:-1;
background:url(https://cdn.nodeimage.com/i/AmQHzWlgl7dq21vn0rvyDgtR4CYlzRiN.webp) center/cover no-repeat;
overflow-x:hidden;
}

body>header {
left:50%;
position:fixed;
top:0;
width:98%;
z-index:10;
transform:translateX(-50%);
border-radius: 0 0 var(--r-l) var(--r-l) !important;
}
#nsk-frame{margin:40px auto 0 auto !important}
footer {left:50%;width:98%;transform:translateX(-50%)}
#nsk-body,
header,
footer {
backdrop-filter: blur(20px) saturate(180%);
-webkit-backdrop-filter: blur(20px) saturate(180%);
background-color:#f1f4f5b3 !important;
border:1px solid #f0f0f066 !important;
border-radius:var(--r-l) !important;
box-shadow:var(--s-m) !important;
transition:all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
header:hover,
footer:hover {box-shadow:var(--s-h) !important;border-color:#ffffff33 !important;transform:translateX(-50%) translateY(-4px)}
.contain {justify-content:space-evenly;padding:0 20px}
footer .col ul li {color:#555}
footer .col .group-head-link {color:#0084ff}
#nsk-left-panel-container .category-list {background-color:#f1f4f5b3}
#nsk-body-left .sorter>a.selected {background-color:#0084ff}
#nsk-body:hover {transform:translateY(-4px);box-shadow:var(--s-h) !important;border-color:#ffffff33 !important}

body,
#nsk-body,
header,
footer {color:#555 !important}
a {text-decoration:none;transition:color 0.3s ease}
.post-list .post-title a:visited {color:#888}
.post-list topic-carousel-panel {min-height:60px}
.user-card .user-stat[data-v-9796effc] {
background-color:#e8f3ff80 !important;
padding:20px;
border-radius:var(--r-m) !important;
box-shadow:var(--s-c) !important;
}
#nsk-right-panel-container .nsk-panel {
background-color:#e8f3ff80 !important;
border-radius:var(--r-m) !important;
box-shadow:var(--s-c) !important;
padding:10px 10px;
margin:0 0 18px;
}

.btn {background-color:#0084ff !important;border-radius:var(--r-l) !important}
.btn:hover {background-color:#55adff !important;transform:scale(1.05)}
.nsk-pager .pager-next,
.nsk-pager .pager-pos,
.nsk-pager .pager-prev {border-radius:var(--r-s) !important}
.nsk-pager .pager-pos.pager-cur {background-color:#0084ff !important;color:#fff !important}
#nsk-body-left .post-list .post-list-item .post-category {
background:#0084ff !important;
border-radius:var(--r-s) !important;
padding:0 8px;
color:#eee;
box-shadow:0 0 4px #00000080;
}
.nav-item-btn{background-color: #f1f4f5b3 !important}
.topic-carousel-index-item[data-v-8db19fce] {background-color:#0000004d}
.current-carousel-index-item[data-v-8db19fce] {background-color:#000000cc}
#nsk-body-left .sorter {border:0px;border-radius:var(--r-m) !important}
#nsk-left-panel-container .category-list {
backdrop-filter: blur(20px) saturate(180%);
-webkit-backdrop-filter: blur(20px) saturate(180%);
border-radius:var(--r-m) !important;
background-color:#f1f4f5b3 !important;
box-shadow:var(--s-m) !important;
transition:all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
#nsk-left-panel-container .category-list:hover {
transform:translateY(-4px);
box-shadow:var(--s-h) !important;
border-color:#ffffff33 !important;
}
#nsk-left-panel-container .category-list a {color:#000}
#nsk-left-panel-container .category-list .current-category a,
#nsk-left-panel-container .category-list a:hover {background:#0084ff;color:#fff}
.expression[data-v-36aaec63] {background-color:#eee;color:#333}
.head-container[data-v-18f8c01b],
.selector[data-v-18f8c01b],
.selector[data-v-159d7f8b],
.head-container[data-v-159d7f8b],
.member-list[data-v-c602bc02] {
-webkit-backdrop-filter: blur(20px) !important;
backdrop-filter: blur(20px) !important;
background-color:#f1f4f5b3 !important;
border:1px solid #f0f0f066 !important;
border-radius:var(--r-m) !important;
box-shadow:var(--s-m) !important;
transition:all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
}
.head-container[data-v-18f8c01b]:hover,
.selector[data-v-18f8c01b]:hover,
.selector[data-v-159d7f8b]:hover,
.head-container[data-v-159d7f8b]:hover {box-shadow:var(--s-h) !important;transform:translateY(-2px)}
.selector .selected[data-v-159d7f8b],
.selector .selected[data-v-159d7f8b]:hover {color:#0084ff !important}
.nsk-post-wrapper .award-corner .corner-triangle {border-top-left-radius:var(--r-m) !important}
.carousel-mask[data-v-8db19fce] {
background:linear-gradient(to right, transparent, #0084ff 200%, #0084ff) !important;
border-radius: 0 16px 16px 0;
min-height:64px !important;
width:40px !important;
}
.expression[data-v-467a77e4] {color:#555}
.topic-select .submit[data-v-467a77e4] {border-radius:20px}
.user-card .user-stat a[data-v-9796effc]:hover {color:#888}
.post-list-controler,
.nsk-pager,
.post-list-item {
border-radius:var(--r-m) !important;
transition:all 0.4s cubic-bezier(0.25, 0.8, 0.25, 1);
margin-bottom:4px !important;
position:relative;
}
.post-list-item:hover {
background-color:#e8f3ff80 !important;
border:1px solid #f0f0f066 !important;
box-shadow:var(--s-c) !important;
transform:translateY(-2px);
}
.topic-carousel-panel[data-v-8db19fce]:hover .post-list-item:hover {box-shadow:none !important}
table tr {color:#333}
.reply-item[data-v-eac5d81a] {color:#333 !important}
.post-content code, .post-content pre {background:#ffffcc !important}
pre:has(> code[data-highlighted="yes"].hljs){
position:relative;
max-height:300px;
overflow:hidden;
transition:max-height 0.5s ease-in-out;
}
pre:has(> code[data-highlighted="yes"].hljs)::after{
content:'';
position:absolute;
bottom:0;
left:0;
width:100%;
height:60px;
background:linear-gradient(to bottom, transparent 0%, #ffffcc 70%);
pointer-events:none;
transition:opacity 0.3s ease;
opacity:1;
}
pre:has(> code[data-highlighted="yes"].hljs):hover{max-height:1000vh}
pre:has(> code[data-highlighted="yes"].hljs):hover::after{opacity:0;visibility:hidden}
.comment-menu .menu-item[data-v-254da704]{color: #555 !important}
.comment-menu .menu-item[data-v-254da704]:hover{color: #0084ff !important}
.user-card .user-stat a[data-v-9796effc]:hover{color: #0084ff !important;}

 
 
背景什么的自行替换，自己动手动脚的乱改，好主题大大地有~
 

忽略了一个重要问题：

使用“自定义css”后左边的导航栏就会失去悬停功能，使用我做的小油猴脚本可以修复。

【油猴脚本】NS 和 DF 导航栏位置修复