博客配置 - 新皮肤

概述

做了一款新皮肤,支持深浅色一键切换 ,浅色、深色各带 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,让它下载到本地调试
相关推荐
FungLeo5 天前
成为全栈·Flutter App 篇·主题与可访问性:深浅色、大字号和触控体验
flutter·移动开发·深色模式·可访问性·成为全栈·大字号适配
周永恒17 天前
AI制作配图
ai·markdown·绘图·工作流·博客园
贾伟康2 个月前
【口算王|17】HarmonyOS ArkTS 亮暗色与视觉令牌实战:集中颜色、间距和交互状态避免页面割裂
harmonyos·arkts·arkui·深色模式·ui设计
贾伟康2 个月前
【时光清单|17】HarmonyOS ArkTS 亮暗色与视觉令牌实战:集中颜色、间距和交互状态避免页面割裂
harmonyos·arkts·arkui·深色模式·设计系统
m0_749690232 个月前
【寻迹校园 HarmonyOS NEXT 实战 36】深色模式不是反色:用语义 Token 管理品牌色与状态色
harmonyos·arkts·深色模式·ui设计·主题设计
伊玛目的门徒2 个月前
deepseek harness DSH 安装皮肤脚手架(dsh‑client‑ui‑skin‑center)踩坑完整记录
ui·插件·皮肤·harness·dsh
高心星7 个月前
鸿蒙6.0应用开发——切换主题
主题·theme·皮肤·鸿蒙6.0·harmonyos6.0
凌镜icecraft1 年前
入园1年零1个月简谈
博客园·陪伴
写点啥呢1 年前
android12解决非CarProperty接口深色模式设置后开机无法保持
android·车机·aosp·深色模式·座舱