精选 · 开放 · 免费
Capacities
你所有思考、学习和创造内容的归宿。
productivitynotes
01
设计气质 DNA
知识管理基于对象关联笔记思维工作室
一个极简的设计工作室,将想法视为有形的对象。
02
色彩
#F59E0BAccent
#1C1917Ink
#57534EInk soft
#FBFBFABG
#FFF9EBBG soft
#F5F4F2BG quiet
#A8A29EMuted
rgba(0,0,0,0.06)Line
温暖、质朴的中性色,以近黑色为基调,搭配一个温暖的金色强调色。
03
字体
geometric-sans · humanist-sans · monospace
- display
64px · 700 - h2
40px · 700 - h3
24px · 600 - body
16px · 400 - small
14px · 400
展示标题使用紧凑的负字距 · 正文保持舒适的 1.6 行高以确保可读性 · 等宽字体仅用于代码块和技术片段
04
间距
4px
8px
12px
16px
20px
24px
32px
48px
64px
96px
128px
遵循一致的 4px 网格,章节内边距宽松(128px)以创造呼吸空间。
05
表面 (圆角 / 阴影 / 边线)
sm · 6px
md · 8px
lg · 12px
pill · 999px
非常细微的 1px 实线边框,采用温暖的浅灰色。
0 1px 2px rgba(0,0,0,0.04) · 0 4px 12px rgba(0,0,0,0.08) · 0 20px 40px -4px rgba(0,0,0,0.12)
06
布局
1200container
12columns
24pxgutter
768 / 1024breakpoints
从单栏居中的主视觉区域,过渡到多栏功能网格。
07
动效与交互
150msmicro
200mssmall
400msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
交互元素上的细微悬停过渡 · 模态框或覆盖层出现时的透明度淡入
细微的背景色变化或透明度偏移。 · 通过颜色加深或轻微缩放提供即时视觉反馈。
08
组件
- button 高对比度的黑色主按钮,配白色文字;透明次级按钮,配黑色文字和图标。
- card 白色、略带圆角的矩形,带有非常柔和的投影,用于浮动的 UI 预览。
- chip 圆角药丸标签,带有柔和的淡彩背景(桃色、蓝色、绿色、紫色)和低饱和度的文字。
- input 简洁的单行输入框,带有圆角和细微边框。
- hero 居中的大号字体排版,搭配浮动的示意性 UI 卡片和温暖的径向渐变覆盖层。
09
文案语气与禁用清单
- 语气 冷静、理性且自信。
- 标题风格 直接、以效益为导向的陈述,易于快速浏览。
- 按钮文案 行动导向且清晰,使用简单的动词,如'免费开始'或'发现产品'。
- 不要使用纯冷白色——截图显示的是温暖的米白色背景(#FBFBFA)。
- 不要使用尖锐的直角——截图中的卡片和按钮有明显的圆角(8px-12px)。
- 不要使用明亮的霓虹色强调——截图使用温暖、柔和的金色(#F59E0B)作为主强调色。
- 不要使用密集、拥挤的布局——截图显示出宽敞的留白和内边距(128px)。
- 不要在标题中使用装饰性衬线字体——截图显示的是简洁、几何感的无衬线展示字体。
- 不要使用厚重的投影——截图使用非常柔和、弥散的阴影来营造纵深感。
- 避免: 过于专业的术语
- 避免: 侵略性的销售语言
- 避免: 过多的标点符号
- 避免: 模糊或充满流行词的描述
10
包内真实截图
桌面首屏(hero)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
桌面滚动分段(90% viewport 步进,作为视觉证据)
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
Capacities 是一款简洁、精致的生产力工具,被设计为'思维工作室'。它使用温暖的米白色背景(#FBFBFA),搭配近黑色的墨迹色(#1C1917)和一个用于强调的金色(#F59E0B)。字体方面,展示部分使用几何无衬线体,正文使用人文主义无衬线体,营造出冷静、理性的基调。布局宽敞,采用 1280px 容器,章节内边距为 128px,并充分利用留白。卡片柔和且富有立体感,带有细微阴影。关键禁忌:绝不要使用冰冷、临床感的白色;绝不要在卡片上使用尖锐的直角;绝不要使用侵略性或霓虹色;避免密集、拥挤的布局;绝不要在标题中使用装饰性衬线体;绝不要使用厚重、生硬的投影。
en · zh-CN · zh-TW · ja · ko