Daniel Triendl 网站预览
Daniel Triendl 网站预览

Daniel Triendl

白色基底、胶囊形控件与细线分隔。

页面以白色为基底,搭配近黑色文字。字体采用 Times、UniversalSans 425。视觉特点包括胶囊形控件、细线分隔、衬线字形、网格布局。适合参考的场景:设计工作室首页、案例展示页。

查看原始网站

使用规范

建议采用

  • 保持画布为纯白色 (#ffffff) —— 插画提供所有色彩,UI 不能有任何色彩竞争
  • 正文、图注和标签采用Times 14px,只有标题或强调文字片段切换为UniversalSans 425。
  • 每张图片均以 1px #000000 细线框起 —— 黑色边框是视觉核心,而非阴影
  • 交互元素(按钮、胶囊控件)圆角设为 48px 以形成完整胶囊形状;图片卡片圆角设为 10px
  • 仅将 #f2f2f2 用于悬浮胶囊导航和柔和标签芯片 —— 严禁用于页面区块
  • 正文和图注文字严格设为14px / 1.2行高 / -0.14px字间距,这种紧凑感是刻意设计。
  • 让 Rza 品牌标识在页眉中精确出现一次 —— 这是整个系统中唯一的展示时刻

建议避免

  • 禁止引入任何色彩 UI 配色 —— 不使用绿色、红色、蓝色或强调色 —— 色彩方案为黑/白/灰的设计原则
  • 禁止为插画卡片添加阴影;唯一允许的阴影是悬浮胶囊导航(rgba(0,0,0,0.1) 0px 4px 4px)
  • 禁止在大字号标题中使用 Times 字体;Times 仅作为 14px 的标签字体,非展示用途
  • 禁止将 Rza 字体混入正文或标签内容 —— 它只存在于品牌标识中
  • 禁止在白色背景上使用 #9b9b9b 作为正文文字 —— 对比度不足(2.8:1);仅用于黑色背景上的元数据/标签,或作为细线边框
  • 禁止在插画图片周围添加内边距或边框 —— 图片需完全填满其网格单元的边缘
  • 禁止创建实心按钮;所有交互元素均为幽灵/空心状态(#000000 边框,无填充)