Paper

如同工作室灯光下的温暖纸质笔记本。
Paper采用温暖纸质工作室的语言:以奶油象牙色画布代替白色,定制展示字体中的单色排版平静克制,唯一的冷蓝强调色几乎不承担UI功能。双色标题是标志性手法,第一行为深色,后续文字为中灰,将首屏文案视为视觉分量的构图,而非单一文字块。表面平铺在页面上,只有一种几乎察觉不到的卡片阴影,边框细如发丝,产品感觉像冷调工作室灯光下的一页印刷笔记本。大部分色彩活力存在于产品截图内,周围的营销表面保持克制、接近无彩色,网格也安静低调。
查看原始网站使用规范
建议采用
- #181818是唯一的填充按钮背景;绝不要引入彩色CTA。
- 将标题分为两种视觉分量:第一行采用Ink(#181818),后续文字采用Slate(#83837e),两者都保持相同的Matter展示字号。
- 页面背景设为Bone Canvas(#efefe4);#ffffff只保留给抬升卡片和产品界面附属元素。
- 按钮和标签采用4px圆角,卡片采用8px,产品框架采用12–24px;同一表面中绝不要混用这些尺度。
- 正文保持Matter 18px、400字重、#666666和1.75行高,以营造编辑式的平静感。
- 三层卡片阴影只用于产品截图和悬浮工具面板;营销卡片保持平面,并采用细线边框。
- 蓝色(#5d8cd7)限定用于品牌标志、装饰矢量图和代码强调,绝不要作为按钮填充或大字号文字颜色。
建议避免
- 不要为CTA、链接或激活状态添加彩色强调;操作语言始终是中性深色。
- 不要将白色(#ffffff)作为页面背景;奶油色画布是标志性特征,替换它会毁掉整体面貌。
- 正文中的行内关键词不要加粗;语气应统一,而非强调式表达。
- 不要为标题、标志或图标行添加卡片阴影;它只属于产品截图和悬浮面板。
- 双色标题不要采用两种不同字号或两种不同字体;效果来自相同Matter字体度量与不同填充颜色。
- 状态不要使用红、绿、黄等饱和语义色;如有需要,改用Pewter或Iron。
- 不要添加渐变;系统平面、温暖且无彩色,唯一的视觉丰富性由产品截图提供。