Jonas Pelzer 网站预览
Jonas Pelzer 网站预览

Jonas Pelzer

白色基底、网格布局与文字主导。

页面以白色为基底。字体采用 Scope、Signifier。视觉特点包括网格布局、文字主导、摄影展示。适合参考的场景:创意机构官网、项目作品集。

查看原始网站

使用规范

建议采用

  • 所有文本元素设为字重400——不使用粗体,不使用半粗体。层级由大小和字间距决定,而非字重。
  • 仅将紫色墨水 (#3502ff) 用于激活导航胶囊和每页一个主要品牌标识。绝不作为其他表面按钮背景填充使用。
  • 标题/导航使用 Scope(无衬线字体)搭配正文使用 Signifier(衬线/斜体字体)——并在单个展示句子中混合罗马体与斜体以营造字体音乐感。
  • 为所有交互元素(导航胶囊、按钮、卡片)设置12px圆角:这种一致性是设计的核心。
  • 所有文字均以 Paper White(#ffffff)为底色,仅将薰衣草色(#c2b3ff)用于满幅装饰卡片填充,绝不作为文本背景或行条纹使用。
  • 使用1px细线边框(Mist Gray #d4d6dd 或 Ink Black #000000)替代阴影进行分隔。唯一允许的阴影是激活导航上的带紫色调的 rgba(53,2,255,0.1)。
  • 保持区块间距为64px,并通过充足的左右边距让页面呼吸——紧凑的内边距仅作用于组件内部,不作用于组件之间。

建议避免

  • 除400外,绝不引入其他字重。不使用500、600、700。系统只有一个声音。
  • 绝不将紫色墨水(#3502ff)作为一般性CTA按钮的填充背景——仅激活导航胶囊处出现填充。
  • 绝不为卡片和面板增加额外阴影。必须依赖细线边框来界定边界。
  • 绝不将首屏标题居中对齐。它始终左对齐,呈杂志风格。居中会破坏编辑性语气。
  • 绝不使用大于12px的圆角。页面清晰锐利、具有建筑感,而非柔和或俏皮。
  • 绝不引入额外的强调色。色彩系统仅为黑色、白色、灰色和三种紫色——这是整个色彩语汇的全部内容。
  • 绝不使用负字间距。所有文字使用正字间距(0.02em–0.036em);紧密的字间距属于另一个设计系统。