精选 · 开放 · 免费
Cupofcouple
一本以编辑精度记录时尚、旅行与设计的精致数字杂志。
EditorialStudioPhotographicPremiumPortfolio
01
设计气质 DNA
视觉日记创意工作室生活方式时尚建筑
一个精选的高端生活方式摄影作品集。
02
色彩
#000000Ink
#F0F0F0BG
#808080Muted
rgba(0,0,0,0.8)Line
极简的单色配色方案，搭配严谨的几何边框，以突出摄影作品。
03
字体
didone-serif · humanist-sans
- display
56px · 400 - heading
32px · 400 - body
16px · 400 - small
10px · 400
标题使用高笔画对比的优雅 Didone 衬线字体。 · 导航和元数据使用干净的、大写无衬线字体，搭配充足的字间距。 · 正文保持统一的 400 字重，以营造精致、低对比度的视觉效果。
04
间距
4px
8px
12px
16px
18px
24px
32px
48px
60px
卡片采用充足的内边距，网格则使用结构化的垂直间距。
05
表面 (圆角 / 阴影 / 边线)
sm · 0px
md · 0px
lg · 0px
pill · 0px
使用 rgba(0, 0, 0, 0.8) 的 1px 细边框，以构建严谨的网格结构。
1px 0px 0px 0px rgba(240, 240, 240, 1)
06
布局
1440container
12columns
768 / 1024breakpoints
严格的矩形网格，可见的边框线充当结构性分隔符。
07
动效与交互
220msmicro
250mssmall
400msmedium
cubic-bezier(0.4, 0, 0.2, 1)easing
悬停时平滑的透明度过渡（0.25秒线性，0.2秒延迟）。 · 交互元素上通用的 0.3 秒过渡。
文本链接和图片的细微透明度变化。 · 标准的指针光标交互。
08
组件
- button 仅文本的大写链接，无背景填充。
- card 以图片为主的卡片，带有纤细的内边框，通过极细网格线分隔。
- chip 极简的文本标签，以垂直管道符号（|）分隔。
- input 无可见边框或背景的简单文本输入框，标记为 'Search...'。
- hero 一个居中的、巨大的展示衬线字体标志，作为视觉焦点。
09
文案语气与禁用清单
- 语气 精致、极简且经过精心策划。
- 标题风格 优雅的衬线字体，全部大写，以产生强烈的视觉分量。
- 按钮文案 低调的、基于文本的导航，不使用突出的按钮。
- 不要使用鲜艳的强调色——截图显示为严谨的单色配色方案。
- 不要使用圆角——截图显示为尖锐的零半径边缘。
- 不要使用投影来营造深度——截图使用细边框来构建结构。
- 不要使用粗体字重——截图显示所有文本均为统一的 400 字重。
- 不要在标题中使用无衬线字体——截图显示所有标题均为衬线字体。
- 不要使用杂乱的布局——截图采用带有极细分隔符的、宽敞的网格结构。
- 避免: 鲜艳的颜色
- 避免: 圆角
- 避免: 用于提升层次的阴影
10
包内真实截图
桌面首屏（hero）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
桌面滚动分段（90% viewport 步进，作为视觉证据）
移动首屏抓自真实页面 · 真 computed styles
11
System Prompt
一本精致的编辑作品集和创意工作室的视觉日记。设计采用浅灰色背景和深灰色/黑色文字的单色配色方案，无强调色。其特点是采用严格的、零半径网格结构，细边框定义各个区域。标题使用优雅的 Didone 衬线字体，导航则使用人文主义无衬线字体，形成对比。切勿使用圆角、投影或鲜艳的强调色；应保持极简、结构化的美学风格。关键颜色：背景 #F0F0F0，墨黑 #000000，线条 rgba(0,0,0,0.8)。
en · zh-CN · zh-TW · ja · ko