theme-LightNotes

设计灵感

打造一个“能呼吸”的数字避风港:这里是我的小窝,是我和果果的生活日常分享,我想把我们自己的想法、我们的爱好、我们的感情融入进去,设计一个很轻柔、无门槛、二次元、通透晴朗的主题。

于是我把想法告诉了GPT-Image,经过多轮深度交流,她帮我手绘了这篇草稿。

核心设计风格

液态玻璃拟态(Glassmorphism) - 一种半透明、模糊的玻璃质感设计,营造轻盈、通透的视觉效果。

配色方案

  • 主色调:低饱和浅天蓝 #6fb0e0 + 奶白底色

  • 深色模式:重新调校的深色玻璃效果参数

  • 整体氛围:二次元治愈系风格,清新柔和

视觉元素

  1. 玻璃卡片:半透明背景(rgba(255,255,255,0.55))、18px 高斯模糊、柔和阴影

  2. 背景层:固定背景插画(支持自定义 URL),支持高斯模糊效果

  3. 漂浮装饰:SVG 云朵和爱心的浮动动画,增添灵动气息

  4. 动态特效:浅色模式飘樱花、深色模式飘雪花的粒子动画

布局结构

  • 双栏布局:桌面端 1.8fr : 1 的主内容区 + 侧边栏

  • 粘性侧边栏:滚动时保持固定位置

  • 响应式设计:1024px 以下单栏,768px 以下移动端适配

字体系统

  • 英文/数字:Maple Mono(等宽字体)

  • 中文:霞鹜文楷(LXGW WenKai),优雅书写风格

交互特色

  • 明暗模式切换(支持系统跟随)

  • 首页说说/文章 Tab 切换

  • 假期倒计时功能

  • 外链安全确认弹窗

  • 文章目录导航

主题已经发布在Github上,大家喜欢可以去下载使用。欢迎多提建议~