01
设计气质 DNA
极简开发者作品集清晰排版深思熟虑匠心打造
一本排版层次清晰的单色个人手册。
02
色彩
#3A3A3AInk#FFFFFFBGrgba(58, 58, 58, 1)Line采用高对比度的严格单色方案,完全依靠字体粗细与间距构建层次感。
03
字体
- display
24px · 400 - body
16px · 400 - small
14px · 400
在无衬线正文中,使用衬线字体来突出显示深思熟虑的短语。 · 为所有正文文本设置充裕的行高,以确保平静的阅读节奏。
04
间距
4px8px16px24px32px48px64px96px采用充裕的垂直间距,保持一致的 24px 栏距与较大的区域间隔(例如 128px)。
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 999px
链接带有下划线,以及由当前文本颜色定义的细微 1px 边框。
06
布局
720container
3columns
24pxgutter
640breakpoints
用于阅读的居中单栏,在项目列表中转变为三栏网格。
07
动效与交互
240msmicro
400mssmall
800msmedium
cubic-bezier(0.25, 0.1, 0.25, 1)easing
链接悬停时的微妙下划线颜色过渡。
标准光标指针,text-decoration-color 带有 0.24 秒过渡效果。 · 立即导航至内部锚点或外部链接。
08
组件
- button 仅文本链接,带有标准下划线装饰。
- card 无卡片设计;信息以清晰、分隔的文本块呈现。
- hero 简洁的左对齐文本介绍,其中包含一个用于强调的斜体短语。
09
文案语气与禁用清单
- 语气 平静、深思熟虑且专业谦逊。
- 标题风格 简洁、描述性且略带诗意。
- 按钮文案 极简且基于文本,侧重于清晰的去向而非行动号召。
- 勿使用多种颜色——网站采用严格单色方案,文本为 #3A3A3A,背景为 #FFFFFF。
- 勿使用厚重阴影或景深效果——界面完全扁平化。
- 勿使用粗体进行强调——层次感依赖于字号、间距和斜体。
- 勿在区域周围添加边框——仅依靠留白分隔所有内容块。
- 勿使用复杂动画——交互仅限于简单的链接过渡效果。
- 勿使用卡片或容器——内容直接呈现在背景上。
- 避免: 过度热情的营销文案
- 避免: 喧闹的行动号召
- 避免: 密集的段落块
- 避免: 视觉杂乱
10
包内真实截图
11
System Prompt
这是一个专注于字体排印工艺与充足留白的极简主义开发者作品集。布局采用居中单栏,偶尔为项目列表转变为简洁的三栏网格。调色板严格单色,使用 #FFFFFF 作为背景,#3A3A3A 作为所有文本元素,不使用强调色。字体排印主要依赖无衬线字体类别以保证可读性,过渡衬线字体则谨慎用于深思熟虑的斜体短语。关键设计规则:永不使用厚重阴影或带边框的容器,避免使用粗体进行强调,切勿用多种颜色或复杂动画使界面显得杂乱。完全专注于精致的间距与清晰、平静的阅读体验。




