博客配置 - 新皮肤

概述

做了一款新皮肤,支持深浅色一键切换 ,浅色、深色各带 8 套主题色。现在的博客就是这个皮肤,需要的可以拿去用。

特性

  • 深/浅色切换:页头月亮按钮切换深浅色
  • 16 套主题色 :
    • 浅色:石板蓝、云白蓝、靛紫、蚂蚁蓝、支付紫、说文、中国红、天青
    • 深色:午夜蓝、德古拉、摩卡、紫夜、东京夜、深海青、北欧蓝、Solarized
  • 主题色按钮:色点循环切换,悬浮显示当前名称,右键色点把当前配色设为默认
  • 多端适应:桌面/手机自适应

效果

浅色八套主题色:

深色八套主题色:

使用方法

前提:

  • JS 权限:需要开通。 页首 HTML 里是脚本,需要JS权限
  • 「禁用模板默认CSS」:不要勾,保持默认。 皮肤是叠加在平台基础样式之上工作的
  • 代码高亮、页脚 HTML:不用动;

如图

粘贴:

博客皮肤选择 SimpleMemory,然后把附件中的三段代码分别整框替换到后台对应位置(顺序与附件一致):

区段 替换位置
区 1 设置 → 博客侧边栏公告(Html 格式)
区 2 设置 → 页面定制 CSS 代码
区 3 设置 → 页首 HTML 代码

替换后:点色点换主题色,月亮/太阳切明暗,右键色点设默认。

附件下载

皮肤附件 skin-deploy.zip。

注意事项

  • 粘贴时只选代码本身(CSS 从 /* 起、脚本从 <script> 起),不要带上"1. 页面定制 CSS 代码"这类标题行
  • 替换前可把后台原有内容备份一份,异常时粘贴回滚
  • 默认主题色想换:改页首脚本顶部的 DEFAULT_PALETTE(1-8 对应色点序号)
  • 有问题可以把网址发给 AI,让它下载到本地调试
相关推荐
贾伟康1 个月前
【口算王|17】HarmonyOS ArkTS 亮暗色与视觉令牌实战:集中颜色、间距和交互状态避免页面割裂
harmonyos·arkts·arkui·深色模式·ui设计
贾伟康1 个月前
【时光清单|17】HarmonyOS ArkTS 亮暗色与视觉令牌实战:集中颜色、间距和交互状态避免页面割裂
harmonyos·arkts·arkui·深色模式·设计系统
m0_749690231 个月前
【寻迹校园 HarmonyOS NEXT 实战 36】深色模式不是反色:用语义 Token 管理品牌色与状态色
harmonyos·arkts·深色模式·ui设计·主题设计
伊玛目的门徒1 个月前
deepseek harness DSH 安装皮肤脚手架(dsh‑client‑ui‑skin‑center)踩坑完整记录
ui·插件·皮肤·harness·dsh
高心星6 个月前
鸿蒙6.0应用开发——切换主题
主题·theme·皮肤·鸿蒙6.0·harmonyos6.0
凌镜icecraft1 年前
入园1年零1个月简谈
博客园·陪伴
写点啥呢1 年前
android12解决非CarProperty接口深色模式设置后开机无法保持
android·车机·aosp·深色模式·座舱
MuGuiLin2 年前
JS媒体查询之matchMedia API 实现跟随系统主题色切换效果
主题色·matchmedia api·js系统主题色切换·css系统主题色切换·系统主题色·js媒体查询·wue前端主题切换
Peter(阿斯拉)2 年前
[Cocoa]_[初级]_[macOS的App在深色模式下文字图标显示不正常的解决办法]
macos·深色模式·浅色模式·强制浅色模式·info.plist