01
设计气质 DNA
知识管理网状思维隐私优先本地优先
一个为你思想准备的私人花园，路径会自然浮现。
02
色彩
#85C8C8Accent#F3F4F6Ink#B7D5D5Ink soft#012A36BG#023643BG soft#A4B5B6Mutedrgba(9, 75, 90, 1)Line深邃、平静的蓝绿色背景搭配柔和、发光的点缀，营造沉浸式、专注的环境。
03
字体
- display
56px · 700 - display
38px · 700 - body-lg
20px · 400 - body
16px · 400 - caption
14px · 400
使用 system-ui 字体栈以获得原生体验 · 标题使用 700 字重 · 正文使用 400 字重 · 辅助文字使用 inkSoft 颜色 (#B7D5D5)
04
间距
4px8px16px24px32px48px64px96px采用一致的 4px 网格以实现精确对齐。
05
表面 (圆角 / 阴影 / 边线)
sm · 4px
md · 8px
lg · 12px
pill · 9999px
1px solid rgba(9, 75, 90, 1)，用于微妙的界定
None: rgba(133, 200, 200, 0.3) 0px 4px 32px 0px
06
布局
1280container
12columns
24pxgutter
768 / 1024breakpoints
居中内容，充裕 padding，响应式布局
07
动效与交互
150msmicro
200mssmall
400msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
hover 状态的平滑过渡 · 内容的淡入效果 · 背景元素的微妙浮动动画
微妙的颜色变化或亮度调整 · 即时的视觉反馈
08
组件
- button 实心蓝绿色主按钮，带圆角。次要按钮为透明或轮廓样式。
- card 半透明的类玻璃卡片，带微妙的蓝绿色边框和圆角。
- chip 用于分类的小型圆角徽章，如“人物”和“书籍”。
- input 圆角搜索栏，采用透明背景。
- hero 大型居中标题，配有插画风格的背景，包含古典雕塑和重叠的界面元素。
09
文案语气与禁用清单
- 语气 深思熟虑、专业且略带哲思
- 标题风格 以行动为导向，聚焦于益处
- 按钮文案 清晰直接，强调本地优先的优势
- 不要使用明亮、饱和的颜色——截图显示的是柔和、去饱和的蓝绿色调
- 不要使用衬线字体——截图显示全程使用无衬线系统字体栈
- 不要使用尖锐的圆角——截图显示保持一致的 8px 圆角
- 不要使用厚重的投影——截图显示的是微妙的蓝绿色辉光效果
- 不要让界面显得拥挤——截图显示有充裕的留白和专注的内容
- 不要大量使用大写字母——截图显示它仅用于小型标签和徽章
- 避免: 技术术语
- 避免: 过于随意的语言
- 避免: 基于恐惧的营销
- 避免: 炒作和流行词
10
包内真实截图
11
System Prompt
Logseq 是一款隐私优先的开源知识库，拥有宁静、专注的暗黑模式界面。设计采用深蓝绿色 (#012A36) 背景，搭配柔和的发光点缀 (#85C8C8) 和半透明的类玻璃卡片。字体排版依赖 system-ui 字体栈，并在显示文本（700 字重）和正文（400 字重）之间建立了清晰的层次。界面强调本地优先原则，语气深思熟虑、专业。关键设计规则：避免使用明亮饱和的颜色，不要使用衬线字体，保持一致的 8px 圆角，使用微妙的蓝绿色辉光代替厚重的投影，保留充裕的留白，并将大写字母的使用限制在小型标签。整体感觉是专注的宁静与思想的深度，与 Logseq 的关联思维哲学相匹配。